css - Select nth element for elements that do not share the same immediate parent -
how select 4th (or specific) li
element in following html structure? possible? (from understanding :nth-child
, :nth-of-type
require elements siblings.)
<div> <ul> <li>apple</li> <li>banana</li> <li>pear</li> </ul> <ul> <li>melon</li> <li>mango</li> </ul> <ul> <li>strawberry</li> </ul> </div>
the above structure dynamic, don't know how many ul
elements there nor how many li
elements each of them contains. there still way select nth li
element on page?
jsfiddle: click
i using less. there in less me?
update:
found :nth-match
css4 pseudo class not (yet) supported: css nth-match doesn't work
, comments/answers confirm belief not possible today... :(
since :nth-child
, other similar selectors make matches based on sibling elements , css has no parent-wise selectors isn't possible.
less language compiled css, doesn't add new features css.
easy alternative use javascript.
Comments
Post a Comment