VPF::Выравнивание дочернего блока по нижнему краю

tishaishii

Дата 22.7.2013, 13:47 (ссылка)

(нет голосов)

Загрузка ...

Создатель

Профиль
Группа: Завсегдатай
Сообщений: 1262
Регистрация: 14.2.2006
Где: Москва

Репутация: нет
Всего: 8

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

Есть код:

Код

<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 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 135
Регистрация: 4.5.2008

Репутация: 1
Всего: 4

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

tishaishii

Дата 23.7.2013, 12:33 (ссылка)

(нет голосов)

Загрузка ...

Создатель

Профиль
Группа: Завсегдатай
Сообщений: 1262
Регистрация: 14.2.2006
Где: Москва

Репутация: нет
Всего: 8

Спасибо.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »