TGViewer
Frontend Developer Frontend Developer @frontenddevelopernews · 182 subscribers
Post #75 161
🎯 CSS: выравниваем по-умному, а не методом тыка

Статья "The Fundamentals of CSS Alignment" (4 сентября 2025) объясняет, как работают свойства выравнивания в Grid, Flexbox и блочном режиме — и почему больше логики, а не путаницы.

Основные тезисы:
• Есть два уровня: контейнер (content) и элемент (item). Удобные шорткаты: place-content, place-items, place-self.
• В Grid-контейнере элементы выравниваются внутри ячеек или областей, а 1fr может поглотить всё свободное пространство и заблокировать выравнивание.
• В Flexbox выравнивание по горизонтали работает группой (через justify-content).
• Для абсолютных элементов (absolute) работает только place-self.
• Чтобы избежать проблем с overflow (например, недоступной областью), используйте safe, например justify-self: safe center.

Читать подробнее: https://css-tip.com/explore/alignment/
Css-Tip The Fundamentals of CSS Alignment This deep dive covers everything you need to know about CSS alignment. It's time to stop doing trial and error and finally understand how everything works!
  • ❤ 1
More from @frontenddevelopernews
  1. Jan 16, 2026🤣🤣🤣
  2. Jan 13, 2026Выпуск №509. Никита Дубко и Вадим Макеев про антивебные API для веба, как LLM и помогает,…
  3. Jan 13, 2026Всем привет! Сегодня прослушала подкаст «Веб-стандарты» #509 и узнала для себя несколько н…
  4. Dec 23, 2025🎄 Advent of JavaScript https://adventjs.dev/ Что это такое: * 24 дня — 24 задачи на JavaS…
  5. Dec 9, 2025💡 Идеальный программист Навыки, которые присущи идеальному разработчику! 😍 Спустя долгое…
  6. Dec 5, 2025Всем привет! Наткнулась в интернете на статью, где автор делится вопросами, которые ему за…
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 →