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

Re: CSS Transitions Feedback

From: Lachlan Hunt <lachlan.hunt@lachy.id.au>
Date: Wed, 10 Dec 2008 15:19:49 +0100
Message-ID: <493FD005.5080100@lachy.id.au>
To: www-style <www-style@w3.org>

Lachlan Hunt wrote:
> [1] http://webkit.org/specs/CSSVisualEffects/CSSTransitions.html

This defines that the transitions are calculated based on the computed 
value, but this creates a problem in cases where the computed value is 

e.g. Assume an image has an intrinsic size of 100x100px, and the 
following rules are applied:

   img { width: 200px; height: 200px; transition-duration: 1s; }
   img:hover { width: auto; height: auto; }

Ordinariliy, when the :hover rules are applied, the used values would be 
the intrinsic width and height, respectively (100px for both).  But 
since the calculations are performed based on the computed value, which 
is 'auto' in this case, what is the expected result?  Since the actual 
width and height won't be known until after the used value is 
calculated, the calculation can't be performed.

WebKit seems to fallback to 0 in this case, and the image is shrunk all 
the way down to nothing.  If the values are reversed, then it gets even 
more interesting because WebKit first changes the image's dimensions to 
0 and then increases it to the new values from there.

   img { width: auto; height: auto; transition-duration: 1s; }
   img:hover { width: 200px; height: 200px; }

Lachlan Hunt - Opera Software
Received on Wednesday, 10 December 2008 14:20:42 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:27:42 UTC