HTML / CSS как сделать так, чтобы нижний колонтитул застрял внизу?

Question

Как мне сделать так, чтобы нижний колонтитул застрял внизу?

Я не хочу, чтобы это исправлялось прокруткой. Я хочу, чтобы он реагировал

main {

float: left;
color: black;
width: 70%;
padding: 10px;
box-sizing: border-box;

}

sidebar {

float: right;
color: white;
background: #2A2B2DFF;
color: white;
width: 30%;
padding: 10px;
box-sizing: border-box;

}

main- нижний колонтитул {

width: 100%;
background: #2A2B2DFF;
height: 50px;
color: white;
text-align: center;

}

Answer 1

Похоже, проблема связана со свойством float. Обычно для этого требуется класс clearfix, которого вам не хватает. Этот класс применяется к родительскому элементу, который обертывает ваши плавающие элементы, подробнее об этом здесь . Я добавил clearfix в ваш код, и теперь нижний колонтитул не "прыгает" вверх страницы: Отметьте это пером . Надеюсь, это решит вашу проблему.

PS рассмотрите возможность использования flexboxes .