Ответ 1
К сожалению, в текущей итерации flexbox (Уровень 1) нет чистого способа решить проблему выравнивания последней строки. Это обычная проблема.
Было бы полезно иметь свойство flex по строкам:
-
last-row
-
last-column
-
only-child-in-a-row
-
alone-in-a-column
Эта проблема, по-видимому, является высокоприоритетной для Flexbox Level 2:
- Рабочая группа Wiki Wiki - вопросы и планирование спецификации
- https://lists.w3.org/Archives/Public/www-style/2015Jan/0150.html
Несмотря на то, что в flexbox этого поведения трудно достичь, в CSS Grid Layout легко и просто:
В случае, если сетка не является вариантом, вот список похожих вопросов, содержащих различные флексографские хаки:
- Правильная калибровка и выравнивание гибких элементов (ов) в последней строке
- Flex-box: выровнять последнюю строку с сеткой
- Обертка Flexbox - различное выравнивание для последней строки
- Как элемент гибкости сохраняет те же размеры, когда он вынужден к новой строке?
- Селектор для одного элемента подряд?
- Выравнивание элементов в последней строке flexbox
- Как я могу позволить гибким элементам расти при сохранении одинакового размера?
- Выровнять по левому краю последнюю строку flexbox, используя пробел между полями и полями
- Несогласованный запас между элементами гибкости в последней строке
- Как сохранить обернутые гибкие элементы той же ширины, что и элементы предыдущей строки?
- Как выровнять левую последнюю строку/строку в нескольких линиях flexbox
- Последние дети сетки получают гигантскую желоба, вызванную полем гибкой связи - между
- Управление выравниванием-содержанием: пробел между последней строкой
- Пространство Flexbox между поведением в сочетании с переносом
- Можно ли использовать CSS Flexbox для растягивания элементов в каждой строке при сохранении согласованной ширины?