Flexbox отличается от других методов вертикального выравнивания тем, что позволяет гибко управлять позиционированием элементов на странице. 14 Ширина и высота блоков автоматически подстраиваются под содержимое. 2 Если применить такой тип выравнивания по центру к нескольким блокам, то они будут выстраиваться в одну линию. 2
Некоторые другие отличия Flexbox от других методов вертикального выравнивания:
- Поддержка браузерами. 1 Flexbox поддерживается только современными браузерами. 1
- Центрирование элемента. 3 Для центрирования элемента по перекрёстной оси (в данном случае — вертикальной) используется свойство align-items, а по главной оси (в данном случае — горизонтально) — свойство justify-content. 3
- Размер элементов. 3 Если установить display: flex у контейнера, все дочерние элементы становятся flex-элементами, выстроенными в ряд. 3 Все они по вертикали примут размер самого высокого элемента, который станет определяющим вертикального размера. 3 Если у flex-контейнера задана высота, то все элементы растянутся до высоты контейнера, независимо от размера содержимого. 3