Принуждать нижний колонтитул оставаться внизу?
У меня нет контейнеров, нет оберток.
У меня просто такой макет ...
<body>
<div id="header">
</div>
<div id="left">
</div>
<div id="right">
</div>
<div class="clear"></div>
<div id="footer">
</div>
Я хочу, чтобы нижний колонтитул всегда оставался внизу экрана, независимо от того, есть ли у меня контент, который идет довольно далеко вниз или даже недостаточно содержимое до самого низа экрана.
На данный момент я могу заставить работать один из двух способов, перечисленных выше, но я хочу, чтобы работали оба.
Вот CSS, который я настроил для этого.
html {
height: 100%;
}
body {
height: 100%;
position: relative;
}
#footer {
position: absolute;
bottom: 0;
}
Я знаю, что если я применяю min-height: 100%; к элементу HTML в документе CSS, который будет идти по мере размещения содержимого, но если у меня нет содержимого, как такового, он не будет оставаться в нижней части экрана. Разрешение независимо.
Я сталкивался с этой проблемой несколько раз и никогда не знаю, как ее решить. Итак, некоторая помощь была бы очень признательна вместе с некоторыми объяснениями.
Большое спасибо за вашу помощь!