Вопрос проверяет понимание фундаментального влияния свойства display на поведение элементов в layout.
display: block заставляет элемент начинаться с новой строки и занимать всю доступную ширину. display: inline размещает элемент внутри строки текста. У блочных элементов работают width, height и вертикальные margin. У строчных — размеры зависят от контента. Это ключевое различие в CSS.
Свойство display определяет, как элемент участвует в построении layout страницы.
Блочные элементы:
начинаются с новой строки
растягиваются по ширине контейнера
поддерживают width и height
корректно обрабатывают все margin и padding
Типичные примеры — div, section, p.
Строчные элементы:
располагаются внутри строки
не создают разрывов строк
игнорируют width и height
не применяют вертикальные margin
Примеры — span, a, strong.
Выбор display напрямую влияет на:
структуру документа
поведение отступов
перенос строк
управление размерами элементов
Часто используется комбинация:
.element {
display: inline-block;
}
Это позволяет сохранить строчное поведение и управлять размерами.
display: inline и display: block формируют принципиально разные модели layout и должны выбираться осознанно.