Menu
In a nested list like the one below, how would one target the ul containing joe without knowing the actual depth in advance?
<ul>
<li>foo
<ul>
<li>bar
<ul>
<li>baz
<ul>
<li>joe</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
http://jsbin.com/fiqowuhate/1/edit?html,css,output
671
A space between selectors will get all matching elements below it, no matter how far down in the tree, so your ol li selector will select all li elements, at all three levels. Use the > selector to get direct children. You also need to anchor them to something at the top level, say a div .
The target selector is used to represent a unique element (the target element) with an id matching the URL's fragment. It can be used to style the current active target element. URLs with a # followed by an anchor name link to a certain element within a document. The element being linked to is the target element.
The :last-child selector allows you to target the last element directly inside its containing element. It is defined in the CSS Selectors Level 3 spec as a “structural pseudo-class”, meaning it is used to style content based on its relationship with parent and sibling content.
As far as I am personally aware, this is not possible as there is currently no parent selector in CSS, but you could use the jQuery selector $('ul:not(:has(ul))'); to target ul elements without any ul children, and add a class to them.
Example
169
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
