CSS supports multiple transform properties

[Antiai]

Good afternoon!
When I checked my CSS file via CSS validator I got a few mistakes:
http://take.ms/x6Ybx

But CSS supports this syntax:
https://developer.mozilla.org/en-US/docs/Web/CSS/transform

Please let me know if I was wrong.
Thank you!

Regards,
Anthony

[lahmatiy]

Hi!
Multiple transform functions is not a problem, but rotate() with value without a unit. The spec defines rotate as rotate( <angle> ). <angle> is a number with one of angle units. Numbers with no unit is not allowed. But, as I can see now, the spec has its own definition for <angle>:

13.2.3.2 The <angle> type
An angle can be a <number> without an unit identifier. In this case the number gets interpreted as a value in degrees.

Looks like this is an exception in scope of this spec influenced by SVG. Because angle unit may to be optional for zero value only (in css2.2 and css3). But I know that zero with no angle unit breaks gradients (e.g. linear-gradient()). Needs to double check...
So, what we should to do:

• fix <angle> generic definition to make zero a valid angle value
• change syntax for rotate rotate( <angle> ) -> rotate( [<angle> | <number>] ) in syntax dictionary to meet the spec and browser behaviour. Also we should address an issue to spec authors to change syntax in spec instead of confusing definition

[lahmatiy]

I found the issue, zero value with no angle unit breaks gradients in Firefox css/csso#229

[Antiai]

Hello! Thank you for the detailed explanation. I didn't know about this issue in Firefox. I'll take it into account. And thank you for your validator. The best feature that I've ever seen for CSS validation purposes. 2016-12-21 0:07 GMT+03:00 Roman Dvornov <notifications@github.com>:

…

I found the issue, zero value with no angle unit breaks gradients in Firefox css/csso#229 <css/csso#229> — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#30 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ASS5-zJM5ZyFcl_X6K-hs6na9BeUMYy1ks5rKEOCgaJpZM4LSPHW> .

[lahmatiy]

Welcome!

I've posted a comment in the spec tracker and then realised I was wrong a little bit.

The <angle> definition is about angle values in transform attribute on SVG elements. So it doesn't affect CSS values. The spec itself says:

... Wherever <angle> is used in this specification, a <number> that is equal to zero is also allowed, which is treated the same as an angle of zero degrees.

Nothing else, no conflicts here.

That's a good news. Because we just need to fix a generic definition of <angle> type in csstree.

[lahmatiy]

Fixed.
Try 1.0.0-alpha9. Web interface and stylelintplugin are updated. Other plugins on the way.

[Antiai]

Yes, It works! Thank you so much! 2016-12-21 14:40 GMT+03:00 Roman Dvornov <notifications@github.com>:

…

Fixed. Try 1.0.0-alpha9 <https://github.com/csstree/csstree/releases/tag/v1.0.0-alpha9>. Web interface and stylelintplugin are updated. Other plugins on the way. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#30 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ASS5-yCcrZKyR8j8yMxNV9za4mY3KHndks5rKRBAgaJpZM4LSPHW> .