CSS Bar Charts Using Modern Functions

**CSS Bar Charts Using Modern Functions**

New CSS features can sometimes make it easier and more efficient to code designs we already knew how to create. This efficiency could stem from reduced code or hacks, or improved readability due to the new features. In that spirit, let’s revamp what’s under the hood of a bar chart. <ul class="chart" tabindex="0" role="list" aria-labelledby="chart-title"> <li class="chart-bar" data-value="32" tabindex="0" role="img" aria-label="32 percentage">32%</li> <!-- etc. --> </ul> We begin by laying out a grid...

---

**[devsupporter 해설]**

이 기사는 CSS-Tricks에서 제공하는 최신 개발 동향입니다. 관련 도구나 기술에 대해 더 알아보시려면 원본 링크를 참고하세요.