Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 22–28 августа.

🔥 Три главные статьи

🖌 CSS

📔 Будьте бдительнее: выражения от контейнера изменили синтаксис, но в последний раз. Самое крупное изменение: теперь в свойстве container имя перед косой чертой должно идти первым container: page-layout / inline-size;

📔 Большое количество примеров использования:has(), начиная с основ, применения в гридах, использования с дочерним и родственными селекторами и заканчивая использования формы без JavaScript.

📔 2 часть использования гридов и кастомных фигур.

📔 Понятно о выражениях от стилей контейнера. Все мы привыкли, что есть выражения от контейнера и думаем, что выражения работают только от размеров (width, height). Но выражения также будут работать с опорой на стили. Спецификация.

📔 Современные CSS-селекторыis(), :where(), :has(). Обзор и разбор.

📔 Познакомимся с top layer и попрощаемся с z-index: 10000.

📔 Как вы используете CSS Columns? Для двухколоночного текста? Попробуйте что-то новое.

🎻 Инструменты

📔 check-html-links — проверяет работоспособность ссылок.

🕸 Браузеры

📔 Могут ли браузеры оптимизировать загрузку сторонних ресурсов. Сложный вопрос и понятный ответ в блоге Chrome.

🎓 Общее

📔 Как сделать отличную кнопку-переключатель? Исследование Эдварда Курича.

Схема Эдварда Курича о том, как сделать кнопку-переключатель

Как читать статьи на английском языке

В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.