Tag
21 articles tagged #CSS.
P.01Chrome 154 shipped September 22, 2026. What can affect your site: HTTP warnings, popover light dismiss, WebSocket options and new CSS, plus a test list.
P.02The :open pseudo-class, Baseline since May 2026, styles <details>, <dialog>, and <select> in their expanded state with one selector. No JS classes needed.
P.03The CSS if() function lets a single property branch on media, container, or feature conditions. What it does, the syntax, and where it still can't replace JS.
P.04One CSS property finally styles the browser's own select, options and icons included, with no dropdown library. The syntax, an example, and real support.
P.05column-rule now works in grid and flexbox, and row-rule joins it. Draw dividers between items in two lines of CSS, plus what to do about support.
P.06Chrome 147, Firefox 146, and Safari 26 all ship contrast-color(), which picks black or white text to meet WCAG AA on any background. Syntax and fallback.
P.07Chrome 152 shipped CSS pseudo-classes matching video and audio state, a CPU Performance API for device tiers, and the start of the end for client-side XSLT.
P.08Chrome 152 added :playing, :paused, :buffering, and :muted as real pseudo-classes. A runnable custom player built on them, plus the JS fallback.
P.09@scope applies CSS only inside part of the DOM, with a lower bound that excludes nested components. No BEM, no Shadow DOM. Syntax and where it falls short.
P.10field-sizing: content reached Baseline in June 2026. The one line of CSS that replaces the scrollHeight hack for auto-growing textareas, and where it stops.
P.11Frontend developer means different things to different teams. The core screen: HTML semantics, CSS fundamentals, Core Web Vitals, and skill beyond React.
P.12CSS @layer lets you set explicit priority between your reset, base, components, and utilities. Here's how cascade layers work in production stylesheets.
P.13Three different approaches to styling a web application — Tailwind, CSS Modules, and CSS-in-JS libraries — and the team contexts where each one actually makes sense.
P.14CSS, Framer Motion, and GSAP each solve different animation problems in 2026. Here's how to pick the right one for your project and skip the rest.
P.15The View Transitions API and scroll-driven animations are now baseline in every major browser. Here's what they replace and working code for both.
P.16Media queries ask how wide the viewport is. Container queries ask how wide the component's parent is. That shift changes how you build reusable components.
P.17Position one element relative to another in pure CSS. No Popper.js, no positioning logic, no recalculation on scroll. How anchor positioning works.
P.18Tailwind v4 moves configuration from JavaScript to CSS, drops the content array, and ships a faster engine. What the breaking changes mean for a real migration.
P.19CSS has changed more in the last 2 years than the previous 10. Here is what is production-ready, what to adopt now, and what you can stop using.
P.20Dark mode is expected by users, but implementing it correctly involves more than swapping colors. Here's how to build a robust, accessible dark mode that users will love.
P.21Mobile-first design in 2026 means designing for device capabilities, context, and user preferences, not just responsive breakpoints and screen size.