Как прижать блок к низу документа?
<body> <section class="catalog"></section> <footer></footer> </body> Код:
.catalog{ |
в этом примере будет вертикальный скрол, как прижать блок к низу можно узнать погуглив фразу CSS Sticky Footer
|
да, мне это и нужно и нужно, а как тогда сделать чтобы
<section class="catalog"></section>растянулся до самого низа документа? (высота внутренних элементом там не хватит) |
нужно документу задать height: 100%;
тоесть
html, body{
height: 100%;
}
|
теперь слишком большой отступ получается :cray: где то 2/3 прокручивать нужно
|
выложите рабочий пример в http://learn.javascript.ru/play
не понятно что нужно отсуп будет т.к. он задан в padding: 40px 0 50px 0; |
http://learn.javascript.ru/play/4QcHVb вот только сохрани у себя как .html а то там этой проблемы не видно
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html,
body {
height: 100%;
}
#catalog {
min-height: 100%;
background-color: blue;
}
footer,
#footer_tab {
height: 100px;
}
#footer_tab {
clear: both;
}
footer {
margin-top: -100px;;
background-color: red;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<html>
<body>
<section id="catalog">
<div id='footer_tab'></div>
</section>
<footer></footer>
</body>
</html>
|
наверное всему виной мои кривые руки, покажи пожалуйста на этом примере http://learn.javascript.ru/play/4QcHVb чтобы без большого отступа снизу было
|
просто когда делаю
html,
body {
height: 100%;
}
появляется слишком большой скрол. |
| Часовой пояс GMT +3, время: 08:29. |