CSS3 Свойство box-pack
Полный CSS Справочник
Пример
Центрировать дочерние элементы блока div, используя свойства box-align и box-pack:
div
{
width:350px;
height:100px;
border:1px solid black;
/* Firefox */
display:-moz-box;
-moz-box-orient:horizontal;
-moz-box-pack:center;
-moz-box-align:center;
/* Safari и Chrome */
display:-webkit-box;
-webkit-box-orient:horizontal;
-webkit-box-pack:center;
-webkit-box-align:center;
/* W3C */
display:box;
box-orient:horizontal;
box-pack:center;
box-align:center;
} |
Попробуйте сами » |
Поддержка Браузерами
Свойство box-pack не поддерживается ни одним из основных браузеров.
Firefox поддерживает альтернативное свойство -moz-box-pack.
Safari и Chrome поддерживают альтернативное свойство -webkit-box-pack.
Определение и ИспользованиеСвойство box-pack указывает, где располагаются дочерние элементы блока, когда
блок больше размера дочерних элементов.
Это свойство указывает горизонтальное положение в горизонтальных блоках и вертикальное положение в вертикальных блоках.
Значение по умолчанию: |
start |
Наследуется: |
нет |
Версия: |
CSS3 |
JavaScript синтаксис: |
объект.style.boxPack="center" |
Синтаксис
box-pack: start|end|center|justify; |
Значение |
Описание |
start |
Для блоков с нормальным направлением, левый край первого дочернего элемента располагается
с левой стороны (все свободное пространство идет за последним дочерним элементом). Для блоков с
обратным направлением, правый край последнего дочернего элемента располагается с правой стороны
(все свободное пространство идет перед первым дочерним элементом) |
end |
Для блоков с нормальным направлением, правый край последнего дочернего элемента располагается
с правой стороны (все свободное пространство располагается перед первым дочерним элементом). Для блоков с
обратным направлением, левый край первого дочернего элемента располагается
с левой стороны (все свободное пространство идет за последним дочерним элементом) |
center |
Свободное пространство делится пополам, первая его половина идет перед первым
дочерним элементом и вторая половина располагается после последнего дочернего элемента |
justify |
Свободное пространство делится поровну между каждым дочерним элементом
(нет свободного пространства перед первым и за последним дочерними элементами) |
Полный CSS Справочник
|