Open utterances-bot opened 2 years ago
Totally awesome Josh! Thanks for sharing. I will definitely use it!
Really cool - I was also thinking about this good use case!
side point - maybe you know why as in your screenshot: https://joshcollinsworth.com/images/post_images/grid-auto-columns.png
when you set grid-auto-colums: 1fr
then the grid columns indicators on top skip #2 ???
Great article and use of grid.
I think you can upgrade your code by using css-variables in your inline-style.
in the css:
grid-column: var(--col-span);
inside the HTML:
<li style="--col-span: 9">
https://codepen.io/rachelbt/pen/BaYObgr
sorry - for the css:
grid-column: span var(--col-span);
Creating dynamic bar charts with CSS grid - Josh Collinsworth blog
How to use CSS grid to make a responsive, adaptable bar chart with no math or external library required!
https://joshcollinsworth.com/blog/css-grid-bar-charts