Box-sizing
Свойство box-sizing
позволяет указать как ведут себя размеры блока при наличии рамок и полей.
Применяются к элементам, у которых заданы размеры.
Спецификация: w3.org/TR/css3-ui/#box-sizing
Возможные значения:
content-box
— отступы и рамки рисуются снаружи блока блока и увеличивают его размеры (значение по умолчанию).
padding-box
— рамки рисуются снаружи блока блока и увеличивают его размеры, padding
отрисовывается внутри элемента и не влияет на размеры. Работал только в Firefox, на ноябрь 2018 уже не поддерживается.
border-box
— элемент сохраняет заданные размеры, отступы и рамки отрисовываются внутрь элемента.
Свойство довольно широко поддерживается браузерами, в некоторых случаях требуются префиксы. Подробнее можно посмотреть на caniuse.com/#feat=css3-boxsizing
- Ссылки по теме:
- * { Box-sizing: Border-box } FTW
- Метки:
- раскладка