Отклонение идеи г-на Алиена ...
Это кажется более чистым решением, чем популярная гибкая видеокарта для браузеров с поддержкой CSS3.
Просто используйте min-height ( вместо высоты) с помощью calc () в блоке содержимого.
Функция calc () начинается со 100% и вычитает высоты верхних и нижних колонтитулов (необходимо указать значения заполнения)
Использование «минимальной высоты» вместо «высоты» особенно полезно поэтому он может работать с представленным javascript контентом и инфраструктурами JS, такими как Angular2. В противном случае вычисление не будет подталкивать нижний колонтитул к нижней части страницы, когда отображаемый контент javascript будет видимым.
Вот простой пример верхнего и нижнего колонтитула с использованием высоты 50px и 20px отступов для обоих.
Html:
<body>
<header></header>
<div class="content"></div>
<footer></footer>
</body>
Css:
.content {
min-height: calc(100% - (50px + 20px + 20px + 50px + 20px + 20px));
}
Конечно, математика может быть упрощена, но вы получите идею ...
Тема была , обсудил на Саммите Разработчика Ubuntu в конце 2011 года.О, Господи! Ubuntu! затронул тему .
Ubuntu Одной команде понравилась идея, но существует много технических проблем перед входом в систему с учетными данными SSO, будет возможно. Не ожидайте видеть его в ближайшее время.