Что заставляет гибкий элемент располагаться рядом с другим, а не стопкой, когда его высота равна 100%?CSS

Разбираемся в CSS
Ответить
Anonymous
 Что заставляет гибкий элемент располагаться рядом с другим, а не стопкой, когда его высота равна 100%?

Сообщение Anonymous »

В этом примере HTML дочерний гибкий элемент "B" расположен рядом с "A", несмотря на то, что родительский элемент имеет гибкое направление столбца.
Удаление высоты: 100% дочернего элемента "B", изменение контейнерного гибкого направления на столбец или удаление flex-wrap: Wrap - все это прекращает такое поведение.
Почему?

Код: Выделить всё





Flexbox

.container {
display: flex; /* flex-direction: row */
flex-wrap: wrap;
width: 200px;
background-color: lightgray;
}
.parent {
display: flex;
flex-wrap: wrap;
flex-direction: column;
width: 100%;
}
.child {
width: 100%;
display: flex;
background-color: lightblue;
}
.child--b {
height: 100%;
}





A
B






Подробнее здесь: https://stackoverflow.com/questions/798 ... its-height
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»