16

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?

2
  • 2
    I don't think there is a way to do this. Also even looking into sass and less, browser support plus math calculation limitations are a hurdle in getting the result you want. I think you may have to use jQuery for this calculation.
    – Nasir T
    Nov 4, 2016 at 13:10
  • I don't think there is a way. Nov 9, 2017 at 4:18

1 Answer 1

3

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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.