Выравнить два блока по нижнему краю

262
02 декабря 2017, 07:36

Всем привет! Я backend-щик, а поставили задачу по верстке. Имеется два блока A и Б, у которых может быть разная высота. Вопрос, как их выровнять по нижнему краю как указано на рисунке.

Answer 1

Используя Flexbox:

.db { 
  display: flex; 
  align-items: flex-end; 
} 
 
.d1 { 
  background-color: blue; 
} 
 
.d2 { 
  background-color: red; 
}
<div class="db"> 
    <div class="d1"> 
        текст текст 
    </div> 
    <div class="d2"> 
        текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст  
    </div> 
</div>

Answer 2

Задайте этим блокам vertical-align: bottom; 

.a,.b{ 
  width: 100px; 
  display: inline-block; 
  background-color: silver; 
  vertical-align: bottom; 
} 
 
.a{ 
  height: 200px; 
} 
 
.b{ 
  height: 160px; 
}
<div class="a"></div> 
<div class="b"></div>

READ ALSO
Восстановление файла css
CSS

Восстановление файла css

Нужен срочный хелп ребятРешил переписать файл css на less, скопировал не весь код и он его в него же скомпилировал, естественно старый код затерся

 265
Отсортировать SQL выдачу
MySQL

Отсортировать SQL выдачу

Добрый день, можете подсказать как мне отсортировать выдачу MySQL по количеству совпадений? К примеру есть запрос

 279
Помогите составить SQL запрос из 3 таблиц
MySQL

Помогите составить SQL запрос из 3 таблиц

Есть три таблицы Salesperson

 291
MySQL подзапрос
MySQL

MySQL подзапрос

Обнаружил интересную фишку в MySQL, хотел узнать поподробнее

 283