@Zuckerberg

Почему флекс элементы с разной длиной текста занимают именно такую ширину и высоту?

Практиковался в верстке и наткнулся на пару момент на флексах, которые не совсем понимаю.

1. Почему флекс элементы с разным текстом занимают по ширине именно столько места? https://jsfiddle.net/hkz91s0f/1/

2. Прочитал, чтобы сделать элементы одинаковые по высоте, надо для контейнера и элементам задать display: flex. Это работает https://jsfiddle.net/hkz91s0f/2/
Но если мне нужно для элементов задать flex-direction: column, то высота опять становиться разная https://jsfiddle.net/hkz91s0f/3/
Можно ли при flex-direction: column, сделать высоту опять одинаковой?
  • Вопрос задан
  • 90 просмотров
Решения вопроса 2
1. Почему флекс элементы с разным текстом занимают по ширине именно столько места? https://jsfiddle.net/hkz91s0f/1/

Количество содержимого в элементе влияет на его базовый размер. Чем больше содержимого - тем больше места, выделяемого под элемент

Можно ли при flex-direction: column, сделать высоту опять одинаковой?

Можно. Задайте для элемента с классом inner свойства
flex-grow: 1;
https://jsfiddle.net/hisbvdis/g7pzwdqt/1/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы