Skip to content

[css-values] Should trigonometric functions work outside of calc? #7265

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

Closed
Antonio-Laguna opened this issue May 10, 2022 · 1 comment
Closed
Labels
Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-values-4 Current Work

Comments

@Antonio-Laguna
Copy link

Hey there!

I've been reading the spec for trigonometric functions to implement them on PostCSS Preset Env.

From reading the spec it's not clear that functions shouldn't work only on calc(). pi and e for example have a special note:

Note: These keywords are only usable within a calculation, such as calc(pow(e, pi) - pi), or min(pi, 5, e). If used outside of a calculation, they’re treated like any other keyword: animation-name: pi; refers to an animation named "pi"; line-height: e; is invalid (not similar to line-height: 2.7, but line-height: calc(e); is).

Webkit's implementation only allows to use inverse trigonometric outside of calc since they resolve to deg however, even if odd, should it be possible to do line-height: sin(45deg) given that it resolves to .707?

@tabatkins tabatkins added the Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. label May 10, 2022
@tabatkins
Copy link
Member

Correct, all the math functions resolve to whatever their types are defined as, and are usable anywhere that accepts those types. Your 'line-height' example is perfectly valid per spec; if WebKit isn't allowing that, it's a bug in their implementation.

@tabatkins tabatkins added the css-values-4 Current Work label May 10, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-values-4 Current Work
Projects
None yet
Development

No branches or pull requests

2 participants