Menu
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://jsfiddle.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.
929
The :first-child selector is used to select the specified selector, only if it is the first child of its parent.
The :first-child: The :first-child selector is used to select those elements which are the first-child elements. For :first-child selector the <! DOCTYPE> must be declared for IE8 and earlier versions. The :first-of-type: The :first-of-type Selector is used to targeting the first child of every element of it's parent.
Using :first-child is very similar to :first-of-type but with one critical difference: it is less specific. :first-child will only try to match the immediate first child of a parent element, while first-of-type will match the first occurrence of a specified element, even if it doesn't come absolutely first in the HTML.
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.
145
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
