MyTetra Share
Делитесь знаниями!
О, смотри-ка какое хорошее место. Дайте два!
Абсолютное позиционирование элемента внутри родительского div
08.04.2013
23:03
Раздел: Компьютер - Программирование - HTML и CSS

Абсолютное позиционирование элемента внутри родительского



В статье "Абсолютное позиционирование элементов (HTML + CSS)" рассматривался аналогичный вопрос, но там говорилось о позиционировании относительно рабочей области браузера. Элементу можно задать положение и внутри родительского элемента, что бывает очень полезным.


Предлагаю рассмотреть следующую реализацию: блок фиксированного размера, внутри которого расположен блок, прижатый к нижнему краю:


#parent

{

position: relative;

background: lime;

width: 200px;

height: 200px;

}


#block

{

position: absolute;

background: blue;

bottom: 0;

left: 0;

right: 0;

height: 30px;

}


<div id="parent">

<div id="block">Hello, world</div>

</div>


Родительскому элементу задается CSS-стиль position со значением relative, это позволяет позиционировать дочерние элементы относительно родительского.


Внутри блок прижимается к нижнему краю при помощи CSS-стилей left, right, bottom.

Так же в этом разделе:
← Содержание ...
 
MyTetra Share v.0.35
Яндекс индекс цитирования