http://cdpn.io/FykHr Кажется, у меня проблема с комбинированными свойствами CSS:
position: absolute;
bottom: 0;
Сначала вы можете видеть, что div.footer не находится внизу. Теперь измените font-size с 120px на 50px, и div, похоже, работает так, как я его ввел.
Как сделать div.footer div внизу (не фиксированным в нижней части экрана), независимо от размера div.content.
Вам нужно добавить position: relative; в родительский контейнер, который в этом случае .wrapper.
Здесь хорошая ссылка на странице абсолютного позиционирования.
Есть один способ сделать это:
body {
height: 100%;
margin: 0;
}
html {
padding-bottom: 50px;
min-height: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
position: relative;
}
footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 50px;
background-color: red;
}
Есть еще одно ограничение. Вы должны знать высоту нижнего колонтитула и установить его в двух местах.