Выбор ответа Junior Блочная модель спрашивают часто обновлено
Ширина содержимого при border-box
Вопрос
Какой будет ширина content-области у блока?
.card {
box-sizing: border-box;
width: 200px;
padding: 20px;
border: 5px solid;
margin: 10px;
}
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: 150px. При border-box в 200px входят content, padding и border.
Варианты ответа
- 150pxправильный ответ
- 200px
- 160px
- 130px
Разбор
При border-box в 200px входят content, padding и border. Content = 200 − 20 × 2 − 5 × 2 = 150px. 200px это вся коробка, 160px не учитывает border, 130px ошибочно вычитает ещё и margin, который в width не входит ни при каком box-sizing.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.