Is there a way to use a clamp as a var ?

I'm using the same clamp for some of my gaps and margins and i would like to store it in a var but it doesn't seems to work. It could also be useful for font sizing. Is there a way to do so ?
6 Replies
Mannix
Mannix2y ago
what does it look like?
Xero'
Xero'2y ago
*{
--largeSpacing: clamp(10px, calc(6.94vw - 43.28px), 40px)
}

.exemple1{
margin-bottom: var(--largeSpacing);
}

.exemple2{
padding: var(--largeSpacing)
}
*{
--largeSpacing: clamp(10px, calc(6.94vw - 43.28px), 40px)
}

.exemple1{
margin-bottom: var(--largeSpacing);
}

.exemple2{
padding: var(--largeSpacing)
}
(values are okward but it allows the min value to be reached at 768px wich is my phone breakpoint and max at 1200px)
Mannix
Mannix2y ago
looks ok but i would set the variable on :root not a * https://codepen.io/MannixMD/pen/vYrxRyj
Mannix
CodePen
vYrxRyj
...
Xero'
Xero'2y ago
there is definitively something i did wrong ^^
13eck
13eck2y ago
Yeah, put your variables on ::root. Otherwise you’re setting that variable on *every * element when you only need it on the one
Mannix
Mannix2y ago
wrong selector maybe ?
Want results from more Discord servers?
Add your server