There’s a lot of nuance to the <dialog> element, a seemingly little piece of web architecture. I’ve got some notes from digging into it.
Powered by
DigitalOcean
A few notes and takeaways from the 2026 State of CSS survey results, including a nice CSS-Tricks cameo!
Today, with CSS gap decorations fully supported in Chrome and Edge, starting with version 149, you can now very easily style gaps, and with a lot of control.
We recently got the shape() function and corner-shape property. What else could we possibly need as far as making shapes in CSS? Let me tell you: the border-shape property!
The soon-Baseline sibling-index() function for animations, CSS and the 2026 FIFA World Cup, use cases for the infinity keyword, container “stuck” queries, and more.
Read all about boundary-aware CSS, accessible grid lanes, time-based web designs, full-bleed, the customizable select, and new web platform features.
@function --font-size() returns { }
@custom-media --tablet (768px <= width <= 1024px);
.element { transform: rotate(45deg); }
.element { transform: rotateY(60deg); }
.element { transform: rotateY(30deg); }
.element { transform: rotateZ(90deg); }
.element { animation-timeline: view(); }
.element { animation-timeline: scroll(); }
