Div занимает не всю высоту

#html #css #height

#HTML #css #высота

Вопрос:

Я создаю очень минималистичную тему WordPress. Я просто не могу понять, почему мой div-файл основной оболочки не занимает всю высоту, как следовало бы. Таким образом, мой нижний колонтитул отображается в середине страницы с абсолютной позицией или без нее.

веб-сайт такой:www.davideasquini.com

Заранее спасибо тем, кто поможет

Ответ №1:

Это должно решить вашу проблему.

CSS:

Для основной оболочки:

 .main-wrapper {
    width: 100%;
    height: 100%;
    margin: 95px 0px 0px 0px;
    padding: 0;
    overflow: visible;
    display: table;
}
  

Для нижнего колонтитула:

 footer {
    width: 100%;
    padding: 30px 0px 25px 0px;
    font-size: 13px;
}
  

Комментарии:

1. я решил, просто не объявляя высоту для .main-wrapper и удалив позицию для нижнего колонтитула… в любом случае спасибо за ответ…

Ответ №2:

Если вы хотите, чтобы нижний колонтитул всегда отображался внизу экрана, измените CSS-атрибут элемента нижнего колонтитула с position:absolute на position:fixed .

Если вы просто хотите, чтобы нижний колонтитул отображался внизу документа, удалите position: absolute элементы нижнего колонтитула и height:100% элемент body.

Причина, по которой ваш нижний колонтитул отображается в середине страницы с нижним колонтитулом, установленным в position:absolute , заключается в том, что содержащий блок нижнего колонтитула установлен ближайшим предком с «позицией» ‘absolute’, ‘relative’ или ‘fixed’, поскольку такого предка нет, содержащим блоком является область просмотра, поэтому при прокрутке страницы вверх нижний колонтитул будет отображаться в середине страницы.

Смотрите, содержащий сведения о блоке