Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Расположение и границы : box-sizing

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

box-sizing | -moz-box-sizing

Используется для изменения заданной по умолчанию блочной модели CSS для вычисления высоты и ширины элемента.

Синтаксис

box-sizing: content-box | border-box
-moz-box-sizing: content-box | border-box | padding-box

Используемые значения

content-box
Значение по умолчанию. Значения для свойств width и height высчитываются только с учетом контента, но не отступов border, margin или padding.
padding-box
Значения для свойств width и height высчитываются только с учетом контента и padding, но не отступов border, margin.
border-box
Значения для свойств width и height высчитываются только с учетом контента и padding и border, но не margin.

Значением по умолчанию является content-box. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Замечания

  • -moz-box-sizing не применяется для ячеек таблиц.
  • min-height/max-height не работают для -moz-box-sizing: border-box.

Можно использовать свойство box-sizing для эмуляции поведения браузеров, которые не поддерживают спецификацию блочной модели CSS.

Примеры

В примере показано как описать свойства box-sizing и -moz-box-sizing

/* поддерживают Firefox, Safari/WebKit, Opera и IE8 */

.example {
   -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
}

Стандарты

Это свойство описано в CSS3 Basic User Interface

Поддерживаемые браузеры

Internet Explorer 8.0

Opera 7.0, 8.0, 9.2, 9.5, 9.6, 10.0

Safari 3.1

Firefox 1.0, 2.0, 3.0, 3.5

Ссылки на источники

https://developer.mozilla.org/en/CSS/box-sizing

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования