CSS динамически позиционирует нижний колонтитул (проблема с липким нижним колонтитулом)
Я пытаюсь добиться того же эффекта, что и липкий нижний колонтитул, но у меня есть проблема, которая не появляется ни в одном учебнике или заданном здесь вопросе: высота моего нижнего колонтитула также является динамичной.
В моем нижнем колонтитуле есть несколько новостей, так что высота нижнего колонтитула меняется в зависимости от длины этих новостей. Очевидно, что я хочу, чтобы нижний колонтитул был расположен абсолютно в нижней части страницы, когда высота содержимого меньше, чем порт просмотра браузера, и относительно содержимого, когда его высота выше, чем фактический порт просмотра.
В настоящее время я успешно реализовал это в jQuery, но я хотел бы использовать метод только для CSS (если есть), потому что некоторые пользователи отключают JavaScript в своих браузерах.
Большое спасибо!
РЕДАКТИРОВАТЬ:
Мой код довольно обычный: у меня есть <header>, <aside>, <section> и <footer> в моем <body> тег. В jQuery я в значительной степени сравниваю сумму высот этих элементов (без нижнего колонтитула) с порт просмотра браузера. Если значение больше, я добавляю position:relative в нижний колонтитул, иначе я добавляю position:absolute; bottom:0 к этому.
1 ответ
CSS может сделать это с помощью bottom:0; position:fixed; однако это не поддерживается IE6 и, возможно, 7. Я бы предложил использовать метод CSS в тандеме с решением jQuery, чтобы у всех ваших пользователей был похожий опыт.