Не могу понять, для чего нужно использовать свойство box-sizing в CSS

231

30 июня 2018, 08:00

Всем здравствуйте! У меня такой вопрос, продолжил я изучение HTML/CSS, и я не могу понять, для чего вообще нужно применять свойство box-sizing для HTML-элементов в CSS. Если кто сможет объяснить более понятно, то было-бы не плохо!

Answer 1

Размер элемента складывается из высоты/ширины его содержимого + размеры padding'ов + размеры border.

Если Вы задаёте элементу width и height, по-умолчанию, это будет шириной/высотой именно содержимого.

То есть, если Вы добавляете свойства padding/border, то визуально элемент увеличится.

Box-sizing меняет это поведение. Если Вы укажете ему значение border-box, то размеры padding и border будут включены в width/height данного элемента.

Подробнее: webref.ru

Answer 2

Не можешь понять - не используй. Когда элементы начнут вылазить на величину отступов (или, возможно, переноситься на следующую строку), поймёшь и применишь box-sizing: border-box. А то может у тебя там вёрстка такая, что он тебе и не нужен.