Липкий нижний колонтитул для html5

Я хочу, чтобы мой нижний колонтитул придерживался нижней части страницы, поэтому, когда страница меньше экрана, нижний колонтитул должен быть на дне в любом случае. Но он не должен конфликтовать с margin в файле css. Поэтому он не должен испортить страницу, когда я использую маржу для некоторых вещей.Липкий нижний колонтитул для html5

источник

2013-10-27 virhonestum

Вам просто нужно создать wrapper div и выйти из нижнего колонтитула. Затем сделайте margin-bottom в этой обертке равной высоте нижнего колонтитула и создайте div push - это будет место для нижнего колонтитула. Посмотрите на это: http://jsfiddle.net/PXYSk/4/

источник

2013-10-27 16:44:54 BordiArt

Это как я делаю это –

и этот метод не работал? – BordiArt

Возможно, он уехал на второй половине дня. –

Попробуйте использовать фиксированное положение и функции CSS3 calc():

JSFiddle

источник

2013-10-27 15:23:13

Вы можете использовать только «bottom: 0;» вместо top с помощью val val ue ... – Thomas

Это самое простое и самое маленькое решение! –

Просто установите колонтитул в position: absolute и bottom: 0.

источник

2013-10-27 15:23:15 Evan

Это хороший пример того, как создать липкий колонтитула, но вы должны фиксированную высоту нижнего колонтитула блока:

CSS:

* { 
margin: 0; 
} 
html, body { 
height: 100%; 
} 
.wrapper { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -50px; 
} 
.footer, .push { 
height: 50px; 
}

HTML:

<html> 
<head> 
    <link rel="stylesheet" href="layout.css" ... /> 
</head> 
<body> 
    <div class="wrapper"> 
     <p>Your website content here.</p> 
     <div class="push"></div> 
    </div> 
    <div class="footer"> 
     <p>Copyright (c) 2008</p> 
    </div> 
</body>

источник

2013-10-27 19:51:33 Newcomer

Липкий нижний колонтитул для html5

ответ

Смежные вопросы