Web Standards

Daily web platform news by @pepelsbey_dev

[Web Standards @webstandardsdev]

CSS is filling the gaps with rules. @utilitybend introduces column-rule, row-rule, rule-break, rule-inset, rule-overlap, and rule-visibility-items for styling gaps in grid and flex layouts. The rules are animatable too. #css #layout

https://t.co/yZSYHVykWf

[Web Standards @webstandardsdev]

The state of CSS centering in 2026. @ChallengesCss compares flexbox, grid, position: absolute, and text-align, explains text-box, anchor-center, and safe vs unsafe centering. #css #layout

https://t.co/Ma2pT3uevL

[Web Standards @webstandardsdev]

Entry and exit transitions with modern CSS. @joyofcodedev shows how @​starting-style, transitions with allow-discrete, and the View Transition API together create smooth, interruptible animations for <dialog> and popovers. #css #animation

https://t.co/cpvtucz36m

[Web Standards @webstandardsdev]

Replacements​.fyi. A tool from the e18e collective that helps you find more performant and safer replacements for outdated or unnecessary npm packages. Type a package name and get drop-in alternatives or short code snippets to use instead. #npm #tools

https://t.co/ofCf0z1Zl4

[Web Standards @webstandardsdev]

CSS vs. JavaScript animations. Josh Comeau shows CSS and the Motion library stay smooth when the main thread is busy, while JS and the GSAP library freeze. Use native CSS when you can, and reach for JS only for what CSS can’t do. #animation #performance

https://t.co/DRuGoIohiy

[Web Standards @webstandardsdev]

Better fluid sizing with round(). @shadeed9 shows how the CSS round() function complements clamp() by snapping fluid values to consistent intervals, avoiding awkward decimals like 19.7px in typography, spacing, and baseline grids. #css

https://t.co/wfqfJCfnJE

[Web Standards @webstandardsdev]

Declarative partial updates. @tunetheweb and @nomsternom introduce processing instructions and new setHTML(), appendHTML(), streamHTML() methods for inserting HTML out of order into specific document locations. #html #api

https://t.co/oPW82F10BQ

[Web Standards @webstandardsdev]

600+ million people write right-to-left: two fixes your app needs. Nina Torgunakova from @evilmartians shows how dir="auto" handles RTL input in English apps, while dir="rtl" plus logical CSS properties enable fully localized UIs. #css #a11y

https://t.co/COaXUoaDLf

[Web Standards @webstandardsdev]

Look up web platform features from your terminal. @patrickbrosset’s wf command shows Baseline status, MDN docs, specs, browser bugs, survey results, and Chrome usage, with data from the W3C WebDX Community Group. #tools #baseline

https://t.co/73fMa2yLlD

[Web Standards @webstandardsdev]

State of CSS 2026. Devographics opened the annual CSS survey, this year focused on the features that matter most. It takes 15–20 minutes and helps map how developers actually use modern CSS. #css #survey

https://t.co/8sF7ftxvu2

[Web Standards @webstandardsdev]

Modern web guidance. A set of expert-vetted skills from the Chrome team that guide AI coding agents toward accessible, performant, and secure web practices, helping with modern features like <dialog>, popover, container queries, passkeys, CSP. #tools #ai

https://t.co/BgSdrqDBna

[Web Standards @webstandardsdev]

Firefox 151 release notes for developers. New shadowrootslotassignment attribute for <template>, @​container style() queries, position-anchor: normal, Document Picture-in-Picture API, desktop Web Serial, and keyboardLock in fullscreen. #firefox #browser

https://t.co/htuoQ6LKeq

[Web Standards @webstandardsdev]

State of AI 2026 survey results. @SachaGreif’s annual survey of 7,258 developers shows AI-assisted coding has gone mainstream, with respondents generating 54% of their code with AI, up from 28% last year. #ai #survey

https://t.co/KU69tbo5mx

[Web Standards @webstandardsdev]

Browsers treat big sites differently. @denodell shows how Safari and Firefox ship thousands of lines of site-specific fixes, while Chrome’s dominance forces minority browsers to compensate, echoing the IE era in reverse. #browser #interop

https://t.co/RMZKjc0U5U

[Web Standards @webstandardsdev]

The HTML Sanitizer API. @ahmadalfy explains the new browser-native API for XSS-safe HTML. setHTML and parseHTML always strip dangerous content, while setHTMLUnsafe variants follow your allow-list or block-list configuration. #security #html

https://t.co/1ZwsqNC2X0

[Web Standards @webstandardsdev]

Soon we can finally banish JavaScript to the ShadowRealm. Mat Marquis walks through the TC39 proposal for isolated execution contexts with pristine globals, perfect for sandboxing third-party scripts. Still at Stage 2.7. #js #ecmascript

https://t.co/Pk3kd4m4K0

[Web Standards @webstandardsdev]

WebKit features for Safari 26.5. The :open pseudo-class, element-scoped random(), color-interpolation for SVG gradients, ToggleEvent.source for popovers, the new Origin API, and 63 bug fixes. #safari #browser

https://t.co/m4YABFs4HW

[Web Standards @webstandardsdev]

How to control infinite CSS animations. In part 1 of 2, @ChallengesCss shows how to speed up, slow down, and reverse infinite CSS animations on demand using animation-composition, CSS variables, and abs() and sign() functions. #css #animation

https://t.co/lL66sfjY19

[Web Standards @webstandardsdev]

From React to native web with nanotags: a migration that saved 100 KB. Pavel Grinchenko from @evilmartians replaced React and Ark UI with native Web Components and a 2.5 KB wrapper, nanotags, cutting 100 KB of JavaScript. #webcomponents #react

https://t.co/fG95Ij614k

[Web Standards @webstandardsdev]

Using safe-area-inset to build mobile-safe layouts. The Polypane blog covers env(safe-area-inset-*), viewport-fit=cover, calc() for extra spacing, and safe-area-max-inset-* that stays stable when the address bar hides. #css #layout

https://t.co/KenNvtxQdY