CODEWITHSUNDEEP
csscalc
RickL
RickL

Reputation: 574

Is there a way to remove units from a calc function in CSS

I'm currently using the following rule:

margin-left: calc(((100vw - 624px) / 144) * 5);

At 1200px viewport width this gives a value of 20px. What I actually want, however, is to get a result of 20%. Ideally that would mean changing the multiplication factor of '5' from an integer to '5%'. But in order to do that I need to remove the units from the rest of the calculation, so that calc would be processing 4 * 5% rather than 4px * 5.

In SASS I could divide by 1px, but in calc you can only divide by a number, not a united value.

Is there a way to remove units from part of a calc function?

Upvotes: 19

Views: 7069

Answers (1)

Tom
Tom

Reputation: 7091

There is a strip-unit function for SASS and other CSS preprocessors, but there's no comparable function in CSS3.

Upvotes: 2

Related Questions