Forums

Creating variables in CSS

Permalink
I would like to create several variables in CSS to hold custom color definitions. WIth Clonamental, in the "Custom CSS" section of the design panel I tried adding this example (picked up from the W3 tutorial site--I'm a novice in these matters)
:root {
  --blue: #1e90ff;
  --white: #ffffff;
}

But the editor for the Custom CSS section flags that up as having errors (related to braces, but probably not the real problem). Is this the wrong place for that sort of code, or something else? Thanks.
 
VidalThemes replied on at Permalink Best Answer Reply
VidalThemes
Hi There,

Your variables will still be there despite the perceived "error" I think that CSS editor pre-dates CSS variables, so simply doesn't recognise them, you can check they have been added to your site, by looking at the page source right click on your page, then click "View page source" then hit "Ctrl + F" to search the page and do a search for ":root" it should show you that your CSS has been added in some style tags on the page.
deoldphart replied on at Permalink Reply
Brilliant! Thanks VidalThemes. I checked the source and the variables are indeed present. I thought it might be due to CSS variables being relatively new, but I wasn't sure if the editor would let them pass.