// writing
Posts tagged #css
A mix of technical deep-dives, career reflections, and dispatches from the road.
tag: #css

developmentOct 18, 2026· 4 min
CSS Gap Decorations: Divider Lines Without the Border Hacks
Chrome and Edge 149 let column-rule and the new row-rule draw lines in grid and flexbox gaps, so you can delete the border and pseudo-element tricks you've been maintaining.
read more →

developmentOct 11, 2026· 3 min
CSS Container Style Queries: Let the Parent Set the Theme
Container style queries hit Baseline in May 2026. Here's how to let a parent's custom property drive its children's styles, plus the one gotcha that trips everyone up.
read more →

developmentSep 17, 2026· 4 min
CSS reading-flow: Fix the Tab Order Your Layout Broke
Grid and flexbox let you rearrange a layout without touching the DOM, which quietly breaks keyboard navigation. The reading-flow and reading-order properties finally let CSS tell the browser which order actually counts.
read more →

developmentSep 6, 2026· 3 min
CSS scroll-state() Queries: Styling Stuck, Snapped, and Scrollable
Sticky headers, snapped carousel slides, and scroll shadows have all been JavaScript jobs for a decade.
read more →

developmentAug 24, 2026· 3 min
Form-Associated Custom Elements: Web Components That Belong in a Form
Custom elements can be real form controls. Here is how formAssociated, ElementInternals, and setValidity retire the hidden-input hack for good.
read more →

developmentAug 13, 2026· 4 min
CSS text-box-trim: The End of Fudging Vertical Padding
Buttons that look bottom-heavy at padding: 12px aren't your fault, they're half-leading. text-box-trim finally lets CSS cut that invisible space, and it…
read more →

developmentAug 3, 2026· 3 min
CSS contrast-color(): Let the Browser Pick Your Text Color
The contrast-color() function went Baseline in April 2026 and kills the luminance-math helper every design system eventually writes.
read more →

developmentJul 27, 2026· 3 min
CSS sibling-index() and sibling-count(): Native Staggering Without nth-child Hacks
CSS sibling-index() and sibling-count() turn an element's position into a number you can drop into calc(), replacing walls of nth-child rules and inline…
read more →

developmentJul 26, 2026· 3 min
Animate to height: auto in CSS with interpolate-size and calc-size()
Transitioning an element to height: auto used to mean JavaScript measurements or fragile max-height hacks.
read more →

developmentJul 20, 2026· 3 min
CSS :has() in Practice: The Parent Selector You Can Finally Ship
The :has() selector is Baseline and fast in 2026. Here's how to use it for parent styling, sibling reactions, and quantity queries without reaching for…
read more →
// the newsletter