CSS все ще заплутує більшість із нас: він має сотні властивостей із поганими назвами, кожна з яких може впливати на результат неінтуїтивно зрозумілим чином. Вертикальне розташування елементів у веб-розробці є складним і часто викликало головний біль у минулому. Але, на щастя, ті дні минули.
Важко повірити: у 2024 році тепер можна буде досягти бажаного результату одним рядком CSS:
0f1273b25d9806459716
0f1273b25d9806459716
У минулому люди використовували безліч інших варіантів для досягнення такого ж результату:
Flexbox
0f1273b25d9806459716
Абсолютне позиціонування
0f1273b25d9806459716
Вбудований блок
0f1273b25d9806459716
The Підтримка браузером align-content тепер дуже добре, і більше немає вагомих аргументів для використання застарілих методів. Крім усього іншого, вам більше не потрібен Flexbox для цього завдання, а дочірній елемент не обов’язково повинен бути в окремому (на відміну від прикладу вище). div бути включені. Дивно, що після десятиліть розвитку CSS тільки тепер має єдину властивість для керування вертикальним центруванням.