2016-03-18 3 views
2

У меня есть следующий код, я хочу установить высоту контейнера на высоту элемента более мелкого гибкого элемента , чтобы я мог скрывать дополнительный контент в более крупном элементе flex ,Установите высоту гибкого конвейера равным высоте наименьшего элемента гибкости

В основном: Меньше гибкий элемент имеет некоторый текст, Более крупный элемент гибкости имеет только изображение.

IDEA является выявление частей изображения, как текст в меньшем гибкого элемента растет

.flex-container { 
 
    display: flex; 
 
    flex-direction: row; 
 
    justify-content: space-between; 
 
    align-items: flex-start; 
 
} 
 
.smaller-flex-item { 
 
    order: 1; 
 
} 
 
.larger-flex-item { 
 
    order: 2; 
 
    overflow: hidden; 
 
}
<div class="flex-container"> 
 
    <div class="smaller-flex-item">Unknown height</div> 
 
    <div class="larger-flex-item">Known Height</div> 
 
</div>

ответ

0

Я пытаемся, чтобы ответить на этот вопрос могу. Я могу только думать о двух путях. Ну вы могли бы попробовать что-то вроде:


.smaller-flex-item { 
order: 1; 
max-height: 200px; 
} 
.larger-flex-item { 
order: 2; 
max-height: 200px; 
overflow: hidden; 
} 

Также вы можете изменить .larger-flex-itemmax-height: 200px; к max-height: inherit;.

Я надеюсь, что это помогло вам!

Смежные вопросы