Хочу на своих страницах сделать так, чтобы независимо от количества информации на ней в центральном блоке - "подвал" всегда был внизу страницы. Это для ситуации, когда страница помещается на экран без скролла. Всё находится в одном диве, которому даю стиль height: 100%, чтобы добиться своего. Всё хорошо, а вот стоит поставить
<!DOCTYPE html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
как снова меня ожидает большой облом - в процентах высота просто никак не воспринимается... В пикселях - да.
Как тогда увеличить высоту дива на 100%?
1. Yuriy - 23 Октября, 2008 - 04:38:46 - перейти к сообщению
2. valenok - 24 Октября, 2008 - 13:45:47 - перейти к сообщению
никак.
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.
Если при скроле футер будет прыгать, то и body указываем position:fixed
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.
Если при скроле футер будет прыгать, то и body указываем position:fixed
3. Yuriy - 24 Октября, 2008 - 20:53:59 - перейти к сообщению
valenok пишет:
никак.
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.
Если при скроле футер будет прыгать, то и body указываем position:fixed
Просто своему footerу position:fixed; width:100%; bottom:0;
а body любую картинку в качестве backgroundа. не обязательно вовсе существующую, главное чтоб была прописана картинка.
Если при скроле футер будет прыгать, то и body указываем position:fixed
Спасибо, но при таком подходе, имея 2 дива - для контента и подвала, при уменьшении окна они налазиют друг на друга... А ещё не получается выровнять по центру body.
CODE (text):
скопировать код в буфер обмена
скопировать код в буфер обмена
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <style>
- body
- {
- padding: 0;
- margin: 0 auto;
- background-image: url(blank.gif);
- }
- #content {
- border: 1px solid blue;
- width: 900px;
- }
- #foot
- {
- position:fixed;
- width: 900px;
- height: 50px;
- bottom:0;
- border: 1px solid orange;
- }
- </style>
- </head>
- <body>
- <div id="content">
- content
- content
- content
- content
- content
- content
- content
- </div>
- <div id="foot">footer</div>
- </body>
- </html>
З.Ы. Не очень понимаю, что даёт картинка...