RE: [css3] "Selectors that People Actually Use"

fantasai wrote:

> Alan Gresley wrote:
> > Boris Zbarsky wrote:
> > 
> >>> p[class*=""], p:not([class*=""]) {}
> >> That's equivalent to the selector "p".
> >>
> >> -Boris
> > 
> > Correct but which is of greater specificity?
> > 
> > 
> > div {width: 100px;height:100px;background:red}
> > div[id*=""], div:not([id*=""]) {background:blue}
> 
> The second selector has greater specificity.
> (Probably it would be shorter to write
>    div[id], div:not([id])
> )
> 
> ~fantasai


It would be shorter still if we just had.

div[id]

since Gecko handles that quite ok. :-)


Anyway div:not([id]) and div:not([id*=""]) are treated different in particular circumstances when using universal selectors and chained selectors.

http://css-class.com/test/css/selectors/not-attribute-variable1.htm


Sarafi 3 and Opera 9.5 passes each test. Gecko 1.9 fails each test.


You could also have a string of selectors.

div.x, dix.y {} /* legacy style */
div[id="x"] {} /* x special style */
div[id="y"] {} /* y special style */
div[id*=""], div:not([id*=""]) {} /* progressive enhancement general style */


Alan

http://css-class.com/

Received on Wednesday, 20 February 2008 02:11:01 UTC