TGViewer
Будни разработчика Будни разработчика @htmlshit · 14.4K subscribers
Post #2943 2.49K
#статья дня

Кто из вас, котаны, использует контейнерные запросы в реальных проектах?

Лес рук...

А ведь всего несколько лет назад запрос на изменение разметки в зависимости от ширины родителя, а не окна (viewport-а), стоял очень остро. Вот мы их получили и... молчание.

Этим же вопросом не так давно задался Крис Койер, создатель CodePen: https://frontendmasters.com/blog/weve-got-container-queries-now-but-are-we-actually-using-them/

Ну и что же, ответ не заставил себя ждать!

Филип Валтон из команды Google Chrome выпустил статью на тему: https://web.dev/blog/how-to-use-container-queries-now

TL;DR
В статье описывается максимально прагматичный подход, в котором пользователи старых браузеров получат мобильную разметку, а современных — все плюшки контейнерных запросов.

Идея, кстати, не нова. Когда вышли финальные версии Flexbox и Grid-ов, многие разработчики и деврелы буквально советовали верстать мобильную разметку, а потом сверху накладывать грид. В итогу худшее, что происходило с пользователями IE 9-11 — они видели мобильную разметку. Ничего страшного же.

Ну что, пользуемся?

#css #cqw #containerqueries
  • 👍 19
  • 👎 2
  • 🤬 1
  • 🤩 1
  • 🤡 1
More from @htmlshit
  1. Oct 16, 2026#заметка дня Когда Гарри Каспаров проиграл DeepBlue в шахматы, всем, в целом, стало понятн…
  2. Oct 15, 2026Post #4324
  3. Oct 14, 2026Атмосфера HolyJS: ради чего стоит приехать на площадку 23–24 октября в Санкт Петербурге и…
  4. Oct 13, 2026#такое дня Сидим, разрабатываем дизайн систему, следуем WCAG, вычитываем эксплейнеры с htt…
  5. Oct 13, 2026🏁Тестовый собес на Frontend с разработчиком из R-Vision, ex-Сбер 15 октября в 19:00 (МСК)…
  6. Oct 13, 2026#инструмент дня Когда надоело, что ссылки из рабочего Slack открываются в личном профиле C…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →