CODEWITHSUNDEEP
htmlcsscss-selectors
Urg Mu
Urg Mu

Reputation: 46

css selector, parent element with child element (and its children)

Can anyone explain why is this not working? on div>ol:first-child ?

div>ul:first-child
{
    background:yellow;
}

The style on top works.. for ul. hi-lighting it. If I change >ul to >ol.. nothing happens 

<div>
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ul>
<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ol>
</div>

http://jsfiddle.net/mFMuq/

Upvotes: 0

Views: 455

Answers (1)

littledynamo
littledynamo

Reputation: 425

From w3schools.com first-child selector:

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

The ol isn't the first child of it's parent, it doesn't actually matter that it's the first ol of it's parent. If you swap the ol and ul around then the ol works but the ul doesn't.

If you want to target the first ol then use the :first-of-type selector. JSFiddle

Upvotes: 2

Related Questions