Using CSS Variables

I did a quick little course on CSS variables on Scrumba today because of an article I read on

What: Learn CSS Variables For Free

Where: @ Scrumba by Per Harald Borgen

Of note: Basically, two things:

CSS variables don’t work on IE11 but in the comments on his post he suggested this Custom Properties (CSS variables) polyfill for IE 11, which seems really nice.

Also, the way he uses CSS variables for responsiveness is very appealing. See the post or the course for more on how to do that.

Thoughts: I’d read about CSS variables before and got very excited for about 5 minutes until I realized it wasn’t supported by IE11. This little course is a nice refresher. The syntax and basic use of CSS variables is not that complex and they can really enrich your CSS life.

Edit: I’ve tried two different polyfills and was not happy enough with the results and from there CSS variables suddenly become a hassle to work with if I actually wanted to implement them in a live site.
The way I use them most, right now, and I’m sure that will change, is during development when I’m unsure of things like color scheme, standard white space or speed in animations. CSS variables make it really easy to make one minor tweak and see it propagated across the page.
Once all the decisions have been made, I find and replace. I’m eager for the day when I won’t have to use that last step. [Feb. 17, 20]

Please know that Opera mini also doesn’t support CSS variables, in case you need to support it in a project.

This is the first course I took on Scrumba. The course consisted of screencasts and then they ask you to pause the video and edit the code in the video and when you’re done, you resume the video. It’s nice to work in the same screen and have the basics already set up but it feels odd that when you resume what you just made is gone and you then watch your instructor do the same things you just did.
It asks a smidgen more of you than freeCodeCamp in their exercises but barely–so far, in this little course.
I might look at some of the other things they offer, specifically their HTML & CSS Crash Course. That might be a nice addendum for students in my WordPress classes and if that looks good, I might try one of their other classes for me–although, I just noticed that the courses I’m interested in are screencast versions of the ones on freeCodeCamp, so then I’d rather do without the screencasts.

Leave a Comment