Hi - I’m revising responsive design and have this css rule in one example piece of code:
width: calc((48em - 100%) * 1000);
I have found lots of examples with say: 100% - so many ems but none with the code above.
Could someone break it down to something meaningful.
Thanks
One em is the font size for the element, so 48em is the font size x 48.
100% is the full width on the containing element.
So the calc is first subtracting the width of the container from 48 type units, then multiplying the result by 1000.
For example if 1em has the default value of 16px and the container is 600px wide you are doing:-
(765 - 600) * 1000
Giving a result of 168000px
16 * 48 = 765
765 - 600 = 165
165 * 1000 = 165000
What you would use this for in CSS is anyone’s guess.
4 Likes
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.