Есть три блока в контейнере: http://prntscr.com/oj34tx
Нужно их выровнять по нижнему краю контейнера, без использования position:absolute. Кто-нибудь знает как? Заранее спасибо!
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуЕсть три блока в контейнере: http://prntscr.com/oj34tx
Нужно их выровнять по нижнему краю контейнера, без использования position:absolute. Кто-нибудь знает как? Заранее спасибо!
Как обычно flex + flex-end
.items {
width: 100%;
height: 200px;
border: 1px solid;
display: flex;
align-items: flex-end;
justify-content: center;
}
.item1,
.item2,
.item3 {
width: 200px;
}
.item1 {
background: lightgreen;
height: 100px;
}
.item2 {
background: lightblue;
height: 130px;
margin: 0 20px;
}
.item3 {
background: tomato;
height: 150px;
}
<div class="items">
<div class="item1"></div>
<div class="item2"></div>
<div class="item3"></div>
</div>