Re: [css4-selectors] Allowing pseudo-classes on pseudo-elements

On 19/03/2011 9:04 AM, fantasai wrote:
> On 03/09/2011 04:34 PM, Sylvain Galineau wrote:
>> Current selector syntax does not allow a pseudo-class to qualify a
>> pseudo-element
>> i.e. E::first-line:hover will not match when the first line of E is
>> hovered.
>>
>> Working through our latest CSS3 Grid Alignment proposal [1], this
>> means one couldn't do :
>>
>> #grid::grid-cell("nav"):hover {
>> ...
>> }
>>
>> One option would be to move the pseudo-class inside the functional
>> part of the
>> pseudo-element which - imo - looks unnatural i.e. the author would be
>> writing
>> something like #grid::grid-cell("nav" :hover) because the syntax
>> disallows
>> #grid::grid-cell("nav"):hover.
>
> Current selector syntax isn't necessarily future selector syntax, and if
> you are
> defining new selectors in your draft you can define appropriate syntax
> there.
>
> This is, btw, most definitely not a css3-selectors issue. If anything
> it's a
> css4-selectors issue. :)
>
> ~fantasai


Really, CSS4? We have implementation of this already.

Sylvain, you the parts mixed up. Try this.


<!DOCTYPE html>
<style type="text/css">
p { font-size: 200% }

p::first-letter {background: lime }

p:hover::first-letter  { background: red }
p::first-letter:hover  { background: orange }

p:hover::first-line  { background: aqua }
p::first-line:hover  { background: yellow }
</style>

<p>Some text to fill this paragraph</p>


Results:

IE9            first-letter = red
                first-line = aqua

Opera 11:      first-letter = red
                first-line = aqua

Safari 5.0.4   first-letter = red

FF 3.6.16:     first-letter = red


I have not checked in FF4b.


This is how I expected it to work. Here is a demo from a few months ago.

<http://css-class.com/test/css/3/expanding-tabs-with-transition.htm>


Second example has this CSS,

.content1 a:hover:after,
.content1 a:focus:after {
   width: 100%;
}

to expand the generated content on :hover. All browsers expand the 
generated content instantaneously where FF4b expands it as a true 
transition.


I don't think we should change current implemented behavior which is.

E:hover::first-letter
E:hover::first-line
E:hover::before
E:hover::after




-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo

Received on Tuesday, 29 March 2011 07:30:42 UTC