CSS is DOOMed: рендеринг DOOM в 3D на CSS. Нильс Линхир создал версию классической игры, где каждый визуальный элемент — это <div>, расположенный в 3D-пространстве с помощью CSS-трансформаций, а JavaScript отвечает только за игровую логику. Проект использует тригонометрические функции CSS, @​property для анимируемых кастомных свойств, anchor positioning для HUD и SVG-фильтры для призрачных врагов. #css #3d

https://nielsleenheer.com/articles/2026/css-is-doomed-rendering-doom-in-3d-with-css/

Выпуск №520. Полина Гуртовая, Вадим Макеев и Алексей Симоненко про Safari 26.4, Firefox 149, TypeScript 6.0 и миксины в CSS.

Лайв на Ютубе https://youtu.be/qjlTiWWpCTc
Слушайте на Ютубе https://youtu.be/y1Ic8tAnAH4
Ссылки на сайте https://web-standards.ru/podcast/520/

The Layout Maestro — практический курс по CSS-раскладкам. Курс Ахмада Шадида учит думать о раскладке, а не просто запоминать синтаксис. Он охватывает флексы, гриды, выражения от контейнера и :has() через визуальные уроки и интерактивные демо, помогая строить устойчивые раскладки, которые не ломаются при изменении контента или размера экрана. #css #learn

https://thelayoutmaestro.com

Под капотом: CSS-архитектура редизайна. Брехт де Рёйте рассказывает о каскадных слоях для приоритета стилей, трёхуровневой системе дизайн-токенов, функции light-dark() для переключения тем, нормализации стилей через :where(), выражениях от контейнера для адаптивных компонентов, логических свойствах и прогрессивном улучшении через @​supports. #css #design

https://utilitybend.com/blog/under-the-hood-a-closer-look-at-the-css-architecture-behind-the-redesign

Новинки WebKit в Safari 26.4. Джен Симмонс представляет 44 новые фичи: grid lanes для masonry-раскладок, WebTransport для двусторонней связи с низкой задержкой и Keyboard Lock API для перехвата клавиатурных сокращений в полноэкранном режиме. Также добавлены name-only container queries, потоковые scroll-driven animations, ReadableByteStream и улучшения раскладки, Web Inspector и доступности. Плюс 191 багфикс. #safari #browser

https://webkit.org/blog/17862/webkit-features-for-safari-26-4/

Новинки Firefox 149 для разработчиков. Релиз добавляет значение hint для popover, CloseWatcher для кастомных закрываемых компонентов, поддержку xywh() в shape-outside, vertical-align как сокращённое свойство, опциональные условия @​container, HTMLSelectElement.showPicker() для элементов <datalist> и HTMLMediaElement.captureStream(). #firefox #browser

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/149

CSSkit, высокопроизводительный CSS-тулчейн на Rust. Проект Кита Циркеля объединяет парсинг, минификацию, линтинг, форматирование, транспиляцию, бандлинг и анализ CSS в одном инструменте без конфигурации. Также включает интеграцию с LSP для поддержки в IDE. Проект вдохновлён oxc и находится в стадии альфы. #css #tools

https://csskit.rs

Выпуск №519. Никита Дубко, Алексей Симоненко и Вадим Макеев про статистику из браузеров, Virtual Keyboard API, обновление Shower, модалки или страницы.

Лайв на Ютубе https://youtu.be/N4ZN1DLtg88
Слушайте на Ютубе https://youtu.be/gXVAPX_42V8
Ссылки на сайте https://web-standards.ru/podcast/519/

Загнутый уголок на CSS. Китти Жиродель разбирает эффект при наведении, при котором угол изображения загибается. Техника сочетает clip-path для обрезки, белый треугольник для складки и тени под ним. Статья также описывает фолбек для эффектов размытия с помощью нескольких смещённых элементов и показывает, как CSS-переходы обеспечивают плавную анимацию. #css #animation

https://kittygiraudel.com/2026/03/05/folded-corner-with-css/

Неожиданные кастомные селекты. Патрик Броссет создаёт три креативные демки с новым кастомизируемым элементом <select>: изогнутую стопку папок с CSS-трансформациями и sibling-index(), веер игральных карт с anchor positioning и круговой эмодзи-пикер на тригонометрических функциях CSS. Все демки сохраняют доступность и адекватно деградируют в неподдерживающих браузерах. #css #html

https://css-tricks.com/abusing-customizable-selects/