RE: Previous-sibling combinator

Tab Atkins Jr. wrote on Friday, August 17, 2012 9:59 AM
> To: Greg Houston
> Cc: Kang-Hao (Kenny) Lu; Marat Tanalin | tanalin.com; WWW Style
> Subject: Re: Previous-sibling combinator
> 
> On Thu, Aug 16, 2012 at 9:54 PM, Greg Houston <gregory.houston@gmail.com>
> wrote:
> > I think the exclamation point was put in the wrong place. It would be
> > better to simply reverse a directional selector. Not only is it much
> > easier to write but it makes a little more sense where we generally
> > think of the exclamation point as meaning "not", like != (not equal).
> > Not UL doesn't make binary sense, but !+ (not next) makes a bit more
> > sense for previous.
> >
> > :matches(!UL + P) > LI
> > vs.
> > P !+ UL > LI
> >
> > :matches(!UL ~ P) > LI
> > vs.
> > P !~ UL > LI
> >
> > :matches(!UL > P) > LI
> > vs.
> > P !> UL > LI
> >
> > :matches(!UL P) > LI
> > vs.
> > P ! UL > LI
> >
> > Not sure If I am writing this one correctly using nested :matches...
> > :matches(!panel > :matches(!header > :matches(!.float-right > .btn)))
> > > footer vs.
> > .btn !> .float-right !> header !> .panel > footer
> 
> You were corrected in another thread, but for posterity I'll re-answer
> this here:
> 
> The ! doesn't "reverse a combinator", though it can look like that in some
> cases.  It just changes which part of the selector is used to return a
> value.
> 
> Your last example can be more easily written as:
> 
> :matches(!.panel > header > .float-right > .btn) > footer

I apologize it advance if this has already been addressed.

Speaking from the point of view of a webmaster who is going to have to maintain implementations of this on my website if I or anyone else uses it, I am strongly in favor of keeping elements that are contained to the right of elements that are doing the containing.  This is for readability when it is in a long chain of containing and contained elements.

Suppose I have a rule which specifies 10 elements and I want styles for a match on that rule to apply to the 6th element in the sequence -- okay, maybe I need to rethink my rule at that point, use ID's, whatever, but I'd still want that sequence to go from outermost to innermost.  ! or whatever arbitrary symbol would be helpful in that case.  

While it is unfortunate that some other syntaxes use ! to mean "not," it already doesn't mean "not" in CSS.  !important doesn't mean "not important."  If people are hung up on the "!" just pick some other symbol.  

Bottom line: please keep the elements in the rule in containing sequence.

Hope this helps, 
Charles Belov 
SFMTA Webmaster

Received on Friday, 17 August 2012 17:39:02 UTC