W3C home > Mailing lists > Public > www-style@w3.org > July 2008

Re: Additional value for the visibility property

From: David Hyatt <hyatt@apple.com>
Date: Wed, 09 Jul 2008 16:52:00 -0500
To: Andrew Fedoniouk <news@terrainformatica.com>
Cc: robert@ocallahan.org, "Ph. Wittenbergh" <jk7r-obt@asahi-net.or.jp>, W3C Style List <www-style@w3.org>
Message-id: <30B5DF44-71DD-44E7-B842-C67E9C1EDE2F@apple.com>

I think most authors would expect opacity to follow the document tree  
and be surprised if it behaved otherwise.

dave

On Jul 9, 2008, at 4:43 PM, Andrew Fedoniouk wrote:

> David Hyatt wrote:
>> On Jul 9, 2008, at 3:53 PM, Andrew Fedoniouk wrote:
>>
>>>
>>> In fact it should be rendered as this:
>>> http://terrainformatica.com/w3/opacity-probe-rendering.png
>>> as opacity is not inherited by default (so div.kid is not  
>>> transparent).
>>
>> We cannot change this.  I do not understand why you are just  
>> bringing this up now.   The vendor prefixes were dropped from  
>> opacity ages ago.  It's done.
> What specification was used for implementing this? That is a point.
> I doubt that any existing designs rely on the fact that opacity  
> establishes new stacking context. So you can change this.
>
> Treating elements with opacity as new stack context roots is  
> unnatural from human point of view as meaning of 'opacity '
> is quite far from stacking context.
>
> I mean it is very hard to explain to ordinary human why div.kid   
> below is rendered with opacity 0.25 rather than 0.5.
> That is far from the concept of out-of-flow and positioned elements  
> I think.
>
> <html>
> <head>
> <style>
>   html { background:url(hatch.gif) repeat; }
>   div { border:3px solid black; }
>   div.container { background-color:yellow; width:100px; height: 
> 100px; opacity:0.5; }
>   div.kid { position:absolute; background-color:magenta; width: 
> 100px; height:100px; left:25px; top:25px; z-index:100; opacity:0.5;}
>   div.stranger { position:absolute; background-color:orange; width: 
> 100px; height:100px; left:50px; top:50px; }
>   div:hover { border-color:red; }
> </style> <head>
> <body>
> <div class="container">
>   div.container
>   <div class="kid">div.kid</div>
> </div>
> <div class="stranger">div.stranger</div>
> </body>
> </html>
>
> -- 
> Andrew Fedoniouk.
>
> http://terrainformatica.com
>
>
>
>
Received on Wednesday, 9 July 2008 21:52:42 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:55:10 GMT