Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Excluding first element in CSS [duplicate]

Tags:

Possible Duplicate:
How to skip first child?

I have a ul with 4 li in it:

<div id="someid">     <ul>        <li>1st</li>        <li>2nd</li>        <li>3rd</li>        <li>4th</li>     </ul> </div> 

I'm setting a style for these li elements:

#someid ul li{       font-weight: bold; } 

Now I want exclude the first li. How can I do it?

like image 612
Ariyan Avatar asked Jan 23 '12 20:01

Ariyan


People also ask

How do I skip the first child in CSS?

By using the :not(:first-child) selector, you remove that problem. You can use this selector on every HTML element.

How do I select the first child of a class in CSS?

The :first-child selector is used to select the specified selector, only if it is the first child of its parent.

What is first child and last child in CSS?

The :first-child pseudo class means "if this element is the first child of its parent". :last-child means "if this element is the last child of its parent". Note that only element nodes (HTML tags) count, these pseudo-classes ignore text nodes.


2 Answers

#someid ul li:not(:first-of-type) {       font-weight: bold; } 

or if that doesn't work in ancient browsers:

#someid ul li {       font-weight: bold; } #someid ul li:first-child {       font-weight: normal; } 
like image 85
Ansel Santosa Avatar answered Sep 18 '22 16:09

Ansel Santosa


Use the CSS first-child selector:

#someid ul li:first-child {      font-weight: normal; } 
like image 40
calebds Avatar answered Sep 21 '22 16:09

calebds