Web Analytics Made Easy -
StatCounter Coding question - CodingForum

Announcement

Collapse
No announcement yet.

Coding question

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Coding question

    I going to use this on my site BUT i have a set of css hover and such for the links on the page already I know how to make the second set BUT how do i do it to this script


    THXS STEVE


    div id="navcontainer">
    <ul id="navlist">
    <li id="active"><Item one</a></li>
    <li><a href="#">Item two</a></li>
    <li><a href="#">Item three</a></li>
    <li><a href="#">Item four</a></li>
    <li><a href="#">Item five</a></li>
    </ul>
    </div>



    <style>
    #navlist li
    {
    display: inline;
    list-style-type: none;
    padding-right: 20px;
    }

    </style>

  • #2
    I have no idea what you're trying to achieve... Next time use proper punctuation to help get your point across.

    Comment


    • #3
      #navlist a:link{....................}
      #navlist a:visited{....................}
      #navlist a:focus{....................}
      #navlist a:hover{....................}
      #navlist a:active{....................}

      They MUST be in this order for them all to work.
      Just think of it w/ this rhyme:
      Lord Vader's Former Handle Anikan.

      I take no responsibility for the above nonsense.


      Left Justified

      Comment


      • #4
        Problem

        This is still controlling the script
        <style>
        a{ color: black }
        a{text-decoration: none;}
        a:hover { color: yellow }
        </style>

        Do you have to insert it differently on the page or ????


        Thxs Steve

        Comment


        • #5
          You can set more than 1 property in a block..

          block {
          prop1: whatever;
          prop2: whatever2;
          etc ...
          }

          So you should have --

          a {
          color: black;
          text-decoration: none;
          }

          a:hover {
          color: yellow;
          }

          I'm not sure what your actual problem is though, could you try to explain it a little clearer please.

          And you have violated our posting guidelines by not using an appropriate title, which you agreed to obey when you signed up for an account!!

          Please read them here!

          [edit:] Ok I see what you mean. Firstly you are missing the first <a> tag in the first <li> element.

          Second use it like --

          ul#navthingy a {
          ... properties ...
          }
          Last edited by Mhtml; Feb 26, 2004, 08:04 AM.
          Omnis mico antequam dominus Spookster!

          Comment


          • #6
            Code Modify Problem

            I am using this code for the links on my page

            <style>
            a{ color: black }
            a{text-decoration: none;}
            a:hover { color: yellow }
            </style>

            Works fine


            I want to use this script on the same page

            I need to know how to modify it so that the above css does not influence the script links

            Thxs Steve



            div id="navcontainer">
            <ul id="navlist">
            <li id="active"><Item one</a></li>
            <li><a href="#">Item two</a></li>
            <li><a href="#">Item three</a></li>
            <li><a href="#">Item four</a></li>
            <li><a href="#">Item five</a></li>
            </ul>
            </div>



            <style>
            #navlist li
            {
            display: inline;
            list-style-type: none;
            padding-right: 20px;
            }

            </style>
            Soory about the posting mistake I hit return and did not look at it

            Comment


            • #7
              I think I know what you mean: you have the following stylesheet defined:
              <style>
              a{ color: black }
              a{text-decoration: none;}
              a:hover { color: yellow; }
              </style>

              (which, incidentally, should be written as):

              <style>
              a:link{ color: black; text-decoration: none;}
              a:hover { color: yellow }
              </style>

              but you don't want that style to apply to links in a <li> tag. Right?

              Well, I'm sure there is a way to apply styles to tags within tags, but I can't think of the syntax. Someone else will surely be along in a minute But another way round it would be to use classes:

              <style>
              a:link{ color: black; text-decoration: none;}
              a:hover { color: yellow }
              a.listitem:link{...styles...}
              a.listitem:hover{...styles...}
              </style>

              Any links on your page that just have <a href="page.htm"> would use the original style declarations, and any that have <a href="page.htm" class="listitem"> would use the new declarations.

              Any help?

              Comment


              • #8
                I believe the easiest thing to do here would be to use descendant selectors.
                You can find some info here, here, here, and here.

                Comment

                Working...
                X