html - Show first set of ul li and hide all subsequent using CSS -


i have following html:

<ul class="articles">     <li>         <!-- display these -->         <ol class="faces">             <li>                 <a href="#">view more #1</a>             </li>             <li>                 <a href="#">view more #2</a>             </li>         </ol>     </li>     <li>         <!-- hide these -->         <ol class="faces">             <li>                 <a href="#">view more #3</a>             </li>             <li>                 <a href="#">view more #4</a>             </li>         </ol>     </li> </ul> 

when page first loaded, show first ol.faces li's (with #1 , #2 anchor links) , hide subsequent ol li's. possible using css without adding more classes?

hide li tags direct descendants of .article

   .articles>li{         display:none;     } 

show first li within .article

.articles>li:first-child{     display: block; } 

working example: http://jsfiddle.net/xnnpr/


Comments

Popular posts from this blog

ruby - Trying to change last to "x"s to 23 -

jquery - Clone last and append item to closest class -

c - Unrecognised emulation mode: elf_i386 on MinGW32 -