- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Sun, 30 Oct 2011 16:52:36 -0700
- To: Lea Verou <leaverou@gmail.com>
- Cc: www-style list <www-style@w3.org>
On Sat, Oct 29, 2011 at 2:02 PM, Lea Verou <leaverou@gmail.com> wrote: > Check this out: http://jsfiddle.net/leaverou/jwHva/2/ > > If you remove border-style: solid; from the div {...} rule, the animation > stops having a visible effect, even though both the interpolated values > contain border-style:solid; (in the shorthand). This doesn't change even > with animation-fill-mode: both; It happens in both Webkit and Mozilla, so > it's probably not a browser bug. > > I discussed it with David Baron on IRC and his explanation was this: > dbaron: I think it may be because each property in the animation gets > handled separately > dbaron: on top of the base values > dbaron: and with a 'none' border style the border-width doesn't do anything > leaverou: but I defined border-style in the animation, through the shorthand > dbaron: I doubt the spec is clear on this point, though. > dbaron: yeah > dbaron: my guess (haven't checked yet) > dbaron: is that despite that, the border-width computes to zero in the > animation > > I took a look at the spec, but couldn't find anything relevant. > I think it's very confusing behavior and potentially a spec bug, so thought > I'd let you guys know. David's likely right. If the three subproperties are resolved and animated independently, then border-width computes to 0 for the start and end, because the base value (ignoring other properties the animation may change) of border-style is 'none'. Thus, no animation happens to the property. That's *really* unexpected, though. Maybe we should specify that the 0% and 100% keyframes are fully applied, rather than being done individually. ~TJ
Received on Sunday, 30 October 2011 23:53:34 UTC