Why :first-child select all children?

I want to select only the very first links from "dropdown menu" (the ones with "ONE" text), but :first-child selects them all.

Link:

http://jsfid开发者_开发百科dle.net/773Xd/1/

Sorry for the mess in the HTML part, but I'm customizing Wordpress theme and it produces so many classes and ids.

The most important thing is at the end of CSS file.

Change your CSS selector to this...

#page-navigation ul li .sub-menu li:first-child a

(i.e. put pseudo class :first-child on the li, not the a).

See it on jsfiddle.net

The old selector didn't work because a is always the first child of the li elements.

But in the new selector, the li is the first child of the ul elements.