Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS supports multiple transform properties #30

Closed
Antiai opened this issue Dec 20, 2016 · 6 comments
Closed

CSS supports multiple transform properties #30

Antiai opened this issue Dec 20, 2016 · 6 comments
Labels

Comments

@Antiai
Copy link

@Antiai Antiai commented Dec 20, 2016

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
Copy link
Member

@lahmatiy lahmatiy commented Dec 20, 2016

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
Copy link
Member

@lahmatiy lahmatiy commented Dec 20, 2016

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

@Antiai
Copy link
Author

@Antiai Antiai commented Dec 21, 2016

@lahmatiy
Copy link
Member

@lahmatiy lahmatiy commented Dec 21, 2016

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 lahmatiy closed this in 981fca6 Dec 21, 2016
@lahmatiy
Copy link
Member

@lahmatiy lahmatiy commented Dec 21, 2016

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

@Antiai
Copy link
Author

@Antiai Antiai commented Dec 21, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.