CSS pseudo-selector :closest and :further

I don't know if here is the right place, but will be great if create a new
pseudo-selector definition that allow select closest or further element
from a base element. For instance:

..button-group > .wrapper > .text > .button > .text


​Now I want select only the first .text, but not the last one, so I can do:

..button-group > .wrapper > .text { color: blue }


But suppose that .wrapper can be another element, or even, it can be more
complex, like:

..button-group > .a > .b > .c > .d > .text > .e > .button > .text


​So if we have a pseudo-selector that can select only the closest element,
we can do that:

..button-group .text:closest​


​It'll match all elements .text closest to .button-group:
​

​.button-group > .wrapper > .text         << match
​.button-group > .wrapper > .text > .text << not match
​.button-group > .label > .text           << match
​.button-group > .a > .b > .text          << match
​.button-group > .a > .b > .text > .text  << not match
​.button-group > .text                    << match


The :further do the inverse:

​.button-group > .wrapper > .text         << not match
​.button-group > .wrapper > .text > .text << match
​.button-group > .label > .text           << not match
​.button-group > .a > .b > .text          << not match
​.button-group > .a > .b > .text > .text  << match
​.button-group > .text                    << not match



-- 
David S. Rodrigues

Received on Wednesday, 18 March 2015 17:21:34 UTC