Свойство box-flex определяет являются ли дочерние элементы блока гибкими в размере или нет.
Элементы, которые являются гибкими, могут уменьшаться или увеличиваться при уменьшении или увеличении блока. Каждый раз, когда появляется дополнительное пространство в блоке, гибкие элементы расширяются, чтобы заполнить все пространство.
| Значение по умолчанию: |
0.0 (указывает, что элемент не гибкий) |
| Наследуется: |
нет |
| Версия: |
CSS3 |
| Синтаксис JavaScript: |
object.style.boxFlex=2.0 |
| Значение |
Описание |
| значение |
Эластичность элемента. Вся эластичность относительна, например дочерний элемент с box-flex: 2 в два раза более эластичный, чем дочерний элемент с box-flex: 1. |
Пример
html
head
style type="text/css"
div {
display: -moz-box; /* Firefox */
display: -webkit-box; /* Safari, Chrome */
display: box;
width: 300px;
border: 1px solid black;
}
#p1 {
-moz-box-flex: 1.0; /* Firefox */
-webkit-box-flex: 1.0; /* Safari, Chrome */
box-flex: 1.0;
border: 1px solid red;
}
#p2 {
-moz-box-flex: 2.0; /* Firefox */
-webkit-box-flex: 2.0; /* Safari, Chrome */
box-flex: 2.0;
border: 1px solid blue;
}
/style
/head
body
div
p id="p1"Привет/p
p id="p2"puzzleweb.ru/p
/div
/body
/html
|