@relows
Учусь веб дизайну и программированию

Как выравнивать текст по нижней границе div?

Мне нужно чтобы текст "66 000р" прилип к нижней части выделенного div элемента5c10e3204008f244296622.png
Как на следующем скрине5c10e36c36e9f516340395.png
  • Вопрос задан
  • 598 просмотров
Решения вопроса 1
SmthTo
@SmthTo Куратор тега CSS
Все перепёлки мира будут оплакивать мою смерть.
Типичная задача.

Для родителя:
display: flex;
flex-flow: column wrap; (чтобы в колонку)
justify-content: space-between; (распределяет дочерние элементы равномерно в рамках родительского блока)

А для детей нужно подбирать параметры свойств flex-grow, flex-shrink и flex-basis (например, flex: 1 0;), чтобы нужные элементы росли по высоте, заполняя пространство, а нижний элемент с ценой — нет.

Пришлите код, иначе будет сложно сказать, что куда подставить. Возможно, нужно будет разметку менять. Скорее всего, flexbox так же будет необходим на всём блоке, чтобы колонки с текстом и фото были равны по высоте.

https://jsfiddle.net/w1pzu5rh/1/.
Зоны выделил разными цветами. Верстка на коленке, но алгоритм будет понятен. Под реальности проекта нужно, конечно, подстроить (ту же минимальную высоту поставить блоку, если нужно, реальные размеры, верстку и т. п.).
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Anubis
@Anubis
Люблю корейскую кухню и веб-разработку
Главному блоку position: relative, блоку с ценой position: absolute; bottom: 0
Ответ написан
Ваш ответ на вопрос

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

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