Published On Apr 8, 2024
In this video, I'll walk you through five great #CSS features that have recently become widely available. From the long-awaited #ContainerQueries to the powerful #has pseudo-class, and the convenience of #CSSNesting to the precision of #Subgrids, we'll explore how these tools can help you in your daily work. Stay ahead of the curve and unlock the full potential of CSS in 2024.
🍿 Chapters:
00:00 Intro
00:38 Container Queries
02:45 Nesting
03:50 Subgrid
05:36 has()
07:48 text-wrap: balance
đź”— Links:
Container Queries: https://codepen.io/fbernack/pen/zYXWWGN
CSS Grid & Subgrid Newspaper: https://codepen.io/fbernack/pen/ZEZQKdM
CSS :has() Usages in Form: https://codepen.io/fbernack/pen/rNbNBvO
CSS Only Material Input with :has(): https://codepen.io/fbernack/pen/poBvMPe
Always great grid - CSS grid + :has() + view transitions: https://codepen.io/web-dot-dev/pen/wv...
Mockup with text-wrap: balance: https://codepen.io/fbernack/pen/yLrKMJp
🧑‍💻 Further information:
Using CSS Nesting: https://developer.mozilla.org/en-US/d...
Introduction to Subgrid: https://developer.mozilla.org/en-US/d...
