Editors note<\/strong>: this post is just an experiment to play with new CSS properties and so the code below shouldn\u2019t be used without serious improvements to accessibility.<\/p>\n\n\n\n

I have a peculiar obsession with charts<\/a> and for some reason, I want to figure out all the ways to make them with CSS. I guess that’s for two reasons. First, I think it’s interesting that there are a million different ways to style charts and data on the web. Second, it’s great for learning about new and unfamiliar technologies. In this case: CSS Grid!<\/p>\n\n\n\n

So this chart obsession of mine got me thinking: how would you go about making a plain ol’ responsive bar chart with CSS Grid, like this:<\/p>\n\n\n\n\n\n\n\n