Блок выходит за границы тега body

Question

Только начал верстку изучать и сразу затык))

html, body {
    font-family: Arial;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    border: 3px solid black;
}

.block {
    height: 100%;
    border: 3px solid red;
}

Я предполагал, что div с классом block будет внутри body, но он внизу выходит за границы, как будто его просто переместили вниз целиком. Почему такое поведение?

Answer 1

Всё правильно Вам в комментариях указали. Осталось только попробовать:

html, body {
    font-family: Arial;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    border: 3px solid black;
    box-sizing: border-box;
}

.block {
    height: 100%;
    border: 3px solid red;
    box-sizing: border-box;
}

<div class="block"></div>

БЛОГ НА HUSL

Блок выходит за границы тега body

Ответы (1 шт):