Вы можете использовать метод абсолютного позиционирования, чтобы выровнять содержимое <div> по нижнему краю.

В следующем примере элемент <div> с классом .content будет размещен внизу элемента div.box. Давайте попробуем понять, как это работает:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CSS Align Content of a Div to the Bottom</title>
<style>
    .box{
        color: #fff;
        background: #000;
        position: relative;
        min-height: 200px;
        padding-bottom: 30px; /* чтобы избежать наложения контента */
    }
    .box .content{    
        position: absolute;
        bottom: 0;
        left: 0;
    }
</style>
</head>
<body>
    <div class="box">
        <h1>Page Title</h1>
        <div class="content">Этот фрагмент текста будет все время оставаться внизу родительского div.</div>
    </div>
</body>
</html>

Читайте также

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.