RE: Previous-sibling combinator

From: Belov, Charles <Charles.Belov@sfmta.com>
Date: Fri, 17 Aug 2012 17:36:38 +0000
To: 'Tab Atkins Jr.' <jackalmage@gmail.com>, Greg Houston <gregory.houston@gmail.com>
CC: "Kang-Hao (Kenny) Lu" <kanghaol@oupeng.com>, Marat Tanalin | tanalin.com <mtanalin@yandex.ru>, WWW Style <www-style@w3.org>
Message-ID: <C1BED60DEFFFB2479E3EE227BF749D2D23BD1539@SV6EX10MBX1.muni.sfgov.org>
```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

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

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:03 UTC