Доктайп

Считаю, что раз везде переснимают сказки, то и нам можно.

Когда дизайнер присылает макет с «инвертированным углом», начинаются страдания. Псевдоэлементы, абсолютное позиционирование, подгонка радиусов — и всё это разваливается, как только под карточкой появляется градиент или картинка.

Александр Першин написал nebo.css — опенсорсную библиотеку для впуклых углов. Название расшифровывается как negative border radius. По духу это как normalize.css: подключаете один CSS-файл, добавляете класс nebo — и угол готов. Работает на любых фонах, настраивается через CSS-переменные.

Разбираем, как это устроено: https://habr.com/ru/articles/987944/

Демонстрация: https://htmlacademy.ru/demos/195

GitHub: https://github.com/htmlacademy/nebo.css

Ну что за штука! Подпишитесь на CSS Боль, там много такого.

CSS 2025: Baseline Widely Available

Сегодня в 20:00 пройдёт легендарный стрим — легендарные фронтенд-ребята соберут CSS-тирлист: что в S-тир, а что пока «ну, прикольно». Container queries. oklch(). Тригонометрия в calc(). Анимация гридов. Range syntax в медиазапросах. И ещё куча возможностей, которые стали доступны в 2025 году.

Смотреть на YouTube
Смотреть в VK

С каждым днём интернет пугает всё больше и больше

— Мам, я хочу Фейстайм!
— У нас есть Фейстайм на чистом CSS дома!

А, или подождите...

— Мам, я хочу Роблокс!
— У нас есть Роблокс на чистом CSS дома!

Роблокс на чистом CSS дома:

CSS теперь умеет сравнивать значения прямо в стилях: запись вроде 10 <= --x <= 12 — это рабочий код, а не псевдоязык.
➿➿➿➿➿➿➿➿➿➿
В свежем выпуске «CSS Боль» разбираем range syntax в стилевых запросах и смотрим, как с его помощью подсветить диапазон дат в календаре на чистом CSS. По пути становится понятно, почему :nth-child(of S) в этой задаче быстро упирается в свои ограничения, а реактивный CSS с переменными и range syntax даёт более прямое и прозрачное решение.

В выпуске:

✓ Как работает range syntax и откуда берётся запись 10 <= --x <= 12 в стилях
✓ Почему :nth-child(of S) не подходит для подсветки диапазона дат в календаре
✓ Как связать custom properties, CSS-математику и условия в стилевых запросах
✓ Пример полностью рабочей подсветки диапазона на чистом CSS, без JavaScript

🐭 Смотреть на YouTube
🐹 Смотреть в VK

Новый выпуск дружественного шоу с Сашей Першиным из HTML Academy о том, почему CSS идёт и туда, и не туда одновременно. Подпишитесь на «CSS Боль», там больно, но хорошо.

Судя по «длинному» тире, предыдущий пост явно написала нейронка, отписываюсь

Не забывайте, что CSS — это непросто

Если вы зачем-то сбежали во фронтенд от математики, то знайте, что в JS можно и так:

А кстати

Для доступа к сайту докажите, что вы не человек.

Это мем из «Героев 3». А знаете, что ещё 3?

3 ноября в Академии стартует открытая неделя с бесплатным доступом к тренажёрам по HTML, CSS и JS, гора призов от партнёров-работодателей и вообще такое!

Очень рекомендуем поучаствовать

Скорость воспроизведения >

Ну такая
Небыстрая
Пойдёт
Понятная
Слегка быстроватая
Тараторка
Подкасты про артхаус
Пятерная


Ну QuickTime, ты чего

Те самые 37 минут, которые могли длиться несколько часов

⚡Слух дня: главного злодея в сериале о фреймворке, который выжил, сыграет Тильда.

Кстати, вот новое лого Windows, Микрософт, с вас пять тыщ