W3C home > Mailing lists > Public > www-style@w3.org > April 2011

Re: Specificity and conflicting selectors

From: Alan Gresley <alan@css-class.com>
Date: Sat, 16 Apr 2011 00:38:44 +1000
Message-ID: <4DA85874.9050207@css-class.com>
To: Yael.Aharon@nokia.com
CC: www-style@w3.org
On 15/04/2011 11:44 PM, Yael.Aharon@nokia.com wrote:
> Hi,
> I have a question about how to handle selectors that have conflicting meaning.
> The background for this question is a webkit bug https://bugs.webkit.org/show_bug.cgi?id=52511 .
> In that bug, the "right" selector has a higher specificity than the "left" selector, yet all major browsers ignore the "right" selector and display the image on the left side.
>
> Should browsers be expected to have the knowledge about these conflicting selectors?
> thanks, Yael


No, an image is a replaced element. Try this.


<!DOCTYPE html>

<style type="text/css">

   #comments { position: relative; border: 2px solid blue; width: 400px; }
   #comments * { position: absolute; left: 0px; }
   #comments * { right: 0px; }
   p {background: lime; }

</style>

<div id="comments">

   <img src="...">

   <p>Test</p>

</div>


What the CSS should have is this.


.rtl #comments img {
     right: 10px;
     left: auto; /* add this to give another value to offset left */
}




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

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
Received on Friday, 15 April 2011 14:39:17 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:39 GMT