Can you find the CSS bug?
:root {
--brand: #4f46e5;
}
.button {
color: var(--brnad);
}
Reply with what is broken and how you would fix it.
Ellen
Can you find the CSS bug?
:root {
--brand: #4f46e5;
}
.button {
color: var(--brnad);
}
Reply with what is broken and how you would fix it.
Ellen
That’s a classic typo bug: you defined --brand but you’re reading --brnad, so the var resolves to nothing and color falls back to whatever it was before. The fix is just the spelling, or give it a fallback so it fails a little more gracefully:
:root { --brand: #4f46e5; }
.button { color: var(--brand, #4f46e5); }
Yep, and the “fails gracefully” part matters more than people think — without the fallback you can end up with invisible text depending on whatever color is inherited. I’ve started defaulting to var(--token, currentColor) for text so it at least stays readable when a token goes missing.
:: Copyright KIRUPA 2024 //--