19 февраля 2015 в 12:39
Подскажите пожалуйста как можно прибить футер к низу, с помощью этого кода:
<html>
<body>
<div id="content"></div>
<div id="footer"></div>
</body>
</html>
<body>
<div id="content"></div>
<div id="footer"></div>
</body>
</html>
CSS-код:
* {
margin: 0;
padding: 0;
}
html {height: 100%;}
* html body {height: 100%;}
body {
min-height: 100%;
position: relative;
}
#content {
padding-bottom: 100px;
}
#footer {
position: absolute;
bottombottom: 0;
height: 80px;
}
Не получается, так как на ноутбуке он прыгает.
Комментарии
«bottombottom: 0;» - это чё?
этот код в интернете был найден
Ну так он же ж кривоватый! Первым делом - исправить на "bottom: 0;"
можете пожалуйста скинуть правильно работающий код
Ну все там правильно, кроме "bottombottom". Один раз пишется "bottom".
все равно прыгает футер на главной странице на ноутбуке
пропиши контенту position: relative;
, а из body его убери.
body это хоть тоже обертка третьей вложенности, но content и footer по отношении к нему являются дочерними эллементами и поэтому не работает. В твоём примере они идут в потоке друг за другом.
Когда ты применяешь абсолютное позиционирование , то таким образом ты вырываешь блок из потока и тому блоку , в который ты хочешь его вставить надо задать относительное позиционирование. так как ты пытаешься его вставить в контент, а относительное позиционирование указано для body, то контент служит для блока с абсолютным позиционированием преградой и не дает блоку встать на нужное место.