1

While there exist selectors to select items preceded (#hlinks+#hsearch) or owned (#topbar>#hlinks) by other items, there's no way to do the opposite.

For example there isn't something like

li:has(ul){ }

To detect list items that have other lists within them. Wouldn't that be convenient?

AFAIK, the feature is not even in the plans for CSS, so my question is: why is this so?

4 Answers 4

4

This is generally called a "parent selector"; as you say, they don't exist in CSS, though they could be useful.

There's an interesting discussion here; the summary is that they would have a large negative effect on performance and would allow people to make mistakes with large consequences. People who understand these things seem to think that these issues can be overcome, but there hasn't yet been sufficient demand for someone to actually do it.

2
  • > these issues can be overcome. Yes, but it's such a frequent need and it's always a pain in the ass to implement properly. Thanks for the answers to all, title edited for future-comers.
    – raveren
    Commented May 17, 2011 at 16:12
  • The impetus for adding this could come either from a standards body such as W3C, or from a browser maker such as Microsoft, Google, Mozilla, or Apple. Some changes happen because one browser starts to support them, and then other browsers join in. However, all of the browser makers are pretty focused on speed, so if performance really is a problem, that's going to make them wary. Commented May 17, 2011 at 16:32
3

You're referring to the concept of a "parent" selector - selecting the parent element under a particular condition. You're correct about this feature not being present in CSS (not event CSS3) - to my knowledge, it not possible at the moment to the way the DOM is parsed by CSS. However, this feature is available using jQuery and the :parent selector or the :has selector, which it seems you may be familiar with already.

EDIT: For a tremendous amount of detail on the idea of a parent selector, see http://shauninman.com/archive/2008/05/05/css_qualified_selectors.

-4

This is standard in CSS since...uh.... the beginning of CSS.

It's just a space:

li ul means any ul that is inside li

2
  • I think he wants to target the li that has a ul child, not the ul itself.
    – kapa
    Commented May 17, 2011 at 15:21
  • 1
    I read the OP as wanting a selector for the li, which triggers only if it has a ul in it.
    – Marcin
    Commented May 17, 2011 at 15:23
-4

If you want to do that just do:

ul li ul li {

}

So now you are searching for any list-item that has an unordered-list inside of it with a list item.

3
  • But this will find the list item at the bottom -- the poster wants to find the ul item at the top (if it contains a list inside). Commented May 17, 2011 at 15:29
  • @JacobM i am not sure what you mean
    – Naftali
    Commented May 17, 2011 at 15:29
  • 2
    Your selector will allow the poster to style an li tag if it is within a list contained by another list. But the poster wants to style the parent li tag (the li that is the second item in your list, not the fourth item), but only when that li contains another list. Current selectors always target the last element described, but the poster wants to target the parent element. Commented May 17, 2011 at 15:31

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.