Math with CSS custom properties

23
November, 2022

/* Nope */
font-size: var(--value) + var(--unit);

/* Yep */
font-size: calc(var(--value) * 1px);

 

another example:

.p {
  width: calc(var(--parentWidth) * var(--leftSize) - var(--padding));
}