Это старая версия документа!
Абсолютное позиционирование и растягивание - надо знать высоту ребенка
В коде примера выполняется центрирование по вертикали и горизонтали. HTML:
1
2
Содержание
3
CSS:
01 #parent {position: relative;}
02 #child {
03 position: absolute;
04 top: 0;
05 bottom: 0;
06 left: 0;
07 right: 0;
08 width: 50%; !–
09 height: 30%; !–
10 margin: auto;
11 }
Идея данного метода заключается в том, чтобы растянуть вложенный элемент до всех 4 границ родительского элемента с помощью установки свойствам top, bottom, right, и left значения 0.
Установка автоматического формирования полей по всем сторонам приведет к заданию равных значений по всем 4 сторонам и выведет наш вложенный элемент div по центру родительского элемента.
К сожалению, данный метод не работает в IE7 и ниже.
http://ruseller.com/lessons.php?rub_id=2&id=1248
Выравнивание по вертикали - не работает в хроме
.right_vhelper {
display:-moz-inline-box; display:inline-block; height:100%; width:0px; vertical-align:middle; zoom:1; //display:inline
}
.right_vcenter{
display:-moz-inline-box; display:inline-block;
vertical-align:middle;
width:170px;
border:1px solid #080;
1background: #DDF;
zoom:1;
1display:inline;
<div class='right_vcenter'>/
<div class='right_vhelper'>/
высоту знать не надо
Инструменты страницы
Если не указано иное, содержимое этой вики предоставляется на условиях следующей лицензии: CC Attribution-Share Alike 4.0 International