[csswg-drafts] [selectors4] :target-within?

LeaVerou has just created a new issue for 
https://github.com/w3c/csswg-drafts:

== [selectors4] :target-within? ==
A very common pattern is having a list of items (e.g. a gallery of 
products, or people, or a list of invoices etc) with every item being 
compact and showing little info until it's clicked, at which point all
 other items disappear and the item expands and displays all the data 
it contains in full size.

This can almost be done with CSS, by using `:target` to expand the 
item when the location hash matches its id. However, there is no way 
to make other items disappear in that case, so horrible hacks are 
usually employed, such as absolutely positioning the item to cover the
 list of other items.

Similar issues (and hacks to solve them) exist with UI patterns such 
as tabs, where if no tab is selected, one wants to show the first tab.

Since `:focus-within` is feasible, I don't see why `:target-within` 
wouldn't be, and it would immensely simplify such tasks. Thoughts?

Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/457 using your GitHub 
account

Received on Thursday, 8 September 2016 19:12:47 UTC