CSS element question

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • kjmaclean
    New Member
    • Mar 2008
    • 1

    CSS element question

    Hello CSS guru's:
    I'm new to CSS and I'm having trouble deciphering markup like this:

    #navcontainer ul { margin: 0; } or even this:

    #navcontainer ul ul li { margin: 0; }

    In the first example, the id #navcontainer is followed by whitespace and another CSS element. In the second example, there are 3 elements that follow the id, which are also separated by whitespace.

    In the first example, I assume that the ul that is associated with #navcontainer will have a margin of 0.

    But I have no idea what the second declaration means.

    My question is, how are elements separated by whitespace in a declaration interpreted?

    Any help would be appreciated.
  • Stang02GT
    Recognized Expert Top Contributor
    • Jun 2007
    • 1206

    #2
    Originally posted by kjmaclean
    Hello CSS guru's:
    I'm new to CSS and I'm having trouble deciphering markup like this:

    #navcontainer ul { margin: 0; } or even this:

    #navcontainer ul ul li { margin: 0; }

    In the first example, the id #navcontainer is followed by whitespace and another CSS element. In the second example, there are 3 elements that follow the id, which are also separated by whitespace.

    In the first example, I assume that the ul that is associated with #navcontainer will have a margin of 0.

    But I have no idea what the second declaration means.

    My question is, how are elements separated by whitespace in a declaration interpreted?

    Any help would be appreciated.
    kjmaclean,

    Welcome to the Scripts! I point you to this site. It provides a lot of good information about CSS with examples and its in a step by step/ chapter like format. So can easily return to where you left off.

    Hopefully that site will help you out. I know it helped me a great deal. Enjoy!

    Comment

    • drhowarddrfine
      Recognized Expert Expert
      • Sep 2006
      • 7434

      #3
      Originally posted by kjmaclean
      #navcontainer ul ul li { margin: 0; }


      Any help would be appreciated.
      You are correct on the first one. The second can be read as "a <li> contained in a <ul> which is contained in a <ul> which is contained in #navcontainer". So the second <ul> is in a <li> of the first <ul>.

      Comment

      Working...