положение нижнего колонтитула CSS придерживается нижней части браузера?
У меня есть проблема с моим сайтом http://artygirl.co.uk/pixie/about/, я, может казаться, не заставляю нижний колонтитул автоматически придерживаться нижней части браузера и выставочной остальной части моего образования. Существует ли решение лучше, чем использование position:fixed или абсолютно?
Я думаю, что существуют возможно другие стили, переопределяющие некоторые тесты, которые я делаю в поджигателе.
Спасибо за Ваши Отношения справки Judi
6 ответов
Это всегда немного сложно, вы можете увеличить минимальную высоту области содержания, но даже тогда, если у кого-то есть на действительно большом экране вы увидите то же самое.
Вы можете использовать немного JavaScript для увеличения min-height , если у кого-то есть огромное окно просмотра, но это все еще не очень элегантно. Я не уверен, что есть решение только для CSS.
Если вы хотите попробовать приведенный выше код, я только что разместил здесь: Все еще сложно определить наличие полосы прокрутки с помощью jQuery? может быть вам полезен.
Установите высоту html и body на 100%, вставьте контейнер div с минимальной высотой 100% и относительным положением и вложите нижний колонтитул с положением: абсолютный, внизу: 0;
/* css */
html, body {
height: 100%;
}
#container {
min-height: 100%;
position: relative;
}
#footer {
position: absolute;
bottom: 0;
}
<!-- html -->
<html>
<head></head>
<body>
<div id="container">
<div id="footer"></div>
</div>
</body>
</html>
Я всегда предпочитаю постранично нижние колонтитулы из-за переменного содержания на страницах. Я использую верхнее поле 5em для нижних колонтитулов. Чаще всего мы знаем высоту содержания, которое может появиться на страницах.
Я использовал технику из этой статьи раньше: Макет CSS: 100% высота с верхним и нижним колонтитулами . Это требует дополнительной разметки в вашем HTML.
Я разобрался. У Html было свойство css для фона, говорящее о белом цвете.
Вы можете установить минимальную высоту для #content . Это не будет фиксировать нижний колонтитул конкретно в нижней части браузера, но гарантирует, что вы всегда сможете увидеть определенное количество фона.
В качестве альтернативы, используя JavaScript, вы можете определить высоту окна браузера, а затем вычислить min-height для #content и применить его с помощью JavaScript. Это гарантирует, что нижний колонтитул всегда будет в правильном месте.