3 replies to this topic

[ACTIONpack]

I'm trying to understand what '>' does more and want to select the first level in my ul list. Can you tell me what do use. I coded out the html and would like to know how to select the first level and then second level only. Thanks

<ul id="blogPost">
         
            <li><!-- First Level -->
             <a href="#">
                 <ul>
                     <li><!-- Second Level -->

                        </li>
                    </ul>
             </a>
            </li>

            <li><!-- First Level -->
             <a href="#">
                 <ul>
                     <li><!-- Second Level -->

                        </li>
                    </ul>
             </a>
            </li>

            <li><!-- First Level -->
             <a href="#">
                 <ul>
                     <li><!-- Second Level -->

                        </li>
                    </ul>
             </a>
            </li>

        </ul>

[LaP]

ul > li

does select the li that are child of the ul.


ul li

does select the li that are descendant of the ul.

<ul id="premier">
  <li>child of ul premier</li>
  <li>
    child of ul premier

    <ul id="deuxieme">
	  <li>descandant of ul premier and child of ul deuxieme</li>
    </ul>
  </li>
</ul>

[threetonesun]

ul#blogPost > li a{color: red;}
ul>:first-child{color: green;}

That will style all the top level lis red, and the first of all the child elements green. If you want all of the lis of the child uls green, just specify to that level, i.e:

ul li ul li{style: something}

[primexx]

don't need the > before :first-child