Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Выравнивание дочернего блока по нижнему краю

Автор: tishaishii 22.7.2013, 13:47

Скажите, как добиться выравнивания дочернего блока по нижнему краю?

Есть код:

Код

<style type="text/css">
.x-parent {
    height: 400px ;
    background-color: #00ff00 ;
}
.x-child {
    height: 35px ;
    background-color: #ff0000 ;
}
</style>

<div class="x-parent">
   <!-- здесь любой код, вставляется из MS Word -->
   <p>jksdfjs </p>
   <p>jksdfjs </p>
   <p>jksdfjs </p>
   <!-- / любой код -->

    <div class="x-child"></div>
</div>

Нужно, чтобы .x-child был всегда внутри .x-parent и в самом низу блока.

Автор: AVA12 23.7.2013, 12:15

Элементарно. Сделать .x-parent позиционированным (например, position: relative) и задать .x-child абсолютную позицию по нижнему краю (position: absolute; bottom: 0px;). При этом позиция будет отсчитываться от бордюра (padding игнорируется).

Автор: tishaishii 23.7.2013, 12:33

Спасибо.