Здравствуйте, гость ( Вход | Регистрация )
 31.5.2009, 7:05
Сообщение
#1
|
|
|
Участник  Группа: Пользователь Сообщений: 77 Регистрация: 8.5.2009 Пользователь №: 9815  |
Пытаюсь прикрепить футер к низу через position:absolute и bottom:0px .
Т. е. положение футера зависит от высоты body. Проблема в том, что блоки с float:left не влияют на эту высоту (для всех кроме IE). Методом "тыка" удалось выяснить, что если к самому body приписать float:left , то все начинает работать как надо. Но я не знаю нормально ли к body такое приписывать. По крайней мере, нигде этого не встречал. Четко сформирую вопросы: 1. Можно ли к body приписывать float:left ? Не появятся ли из-за этого потом проблемы? 2. Как обычно поступают в таких случаях (про существование гугла я знаю, но в тех случаях, что мне удалось найти либо футер крепился по-другому, либо не было блоков с float)? И пример что бы попробовать: HTML <!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> <title>blank</title> <style type="text/css"> * { margin: 0px; padding: 0px; } html { width: 100%; height: 100%; } body { width: 100%; height: auto !important; height: 100%; min-height: 100%; position: relative; /*float: left;*//* если расскомментировать, то все заработает как надо */ } #header { width: 100%; height: 48px; background: #000; } #menu { width: 290px; padding: 50px 0px 98px 0px; background: #fcc; float: left; } #content { margin-left: 290px; padding: 50px 50px 98px 50px; background: #cfc; } #footer { width: 100%; height: 48px; background: #000; position: absolute; left: 0px; bottom: 0px; } </style> <script type="text/javascript"> var toggleText = function(elem) { elem = document.getElementById(elem.value); elem.innerHTML = elem.innerHTML.length < 1000 ? new Array(2001).join('text ') : 'text'; }; </script> </head> <body> <div id="header"> <input type="button" value="menu" onclick="toggleText(this);" /> <input type="button" value="content" onclick="toggleText(this);" /> </div> <div id="menu"> text </div> <div id="content"> text </div> <div id="footer"> </div> </body> </html> Сообщение отредактировал Riim - 31.5.2009, 12:14 |
 |
 
|
 |
|
1.6.2009, 17:47
Сообщение
#2
|
|
|
Участник Группа: Пользователь Сообщений: 77 Регистрация: 8.5.2009 Пользователь №: 9815 |
Цитата(psywalker @ 1.6.2009, 18:04)  А во вторых почему фон левой колонки не опускается при заполнении правой и наоборот? Неужели думаешь, что я сам не заметил. Ссылки, которые дал мне Octane, проблему с фоном идеально разжевывают. Здесь же я подкрасил, что бы видно было. В конечном варианте фона не будет. Цитата(psywalker @ 1.6.2009, 18:04) а в ИЕ6 ты смотрел? Да в IE6 явная проблема. Что-то с ходу решить не получается. Добавлено: Вот такое решение нашлось: http://www.webcocktail.ru/coding/positioni...-at-the-bottom/ Вроде работает, но приходится подстраивать содержание под оформление. Может кто-нибудь решение получше знает? Сообщение отредактировал Riim - 2.6.2009, 7:02 |
|
|
|
Riim Проблема с float 31.5.2009, 7:05
psywalker Не надо ничё ни на что вешать и изобретать, просто... 31.5.2009, 10:41 Riim ЦитатаНе надо ничё ни на что вешать и изобретать, ... 31.5.2009, 11:01 Riim Всем спасибо. Проблема решена здесь: http://xhtml.... 1.6.2009, 12:30 psywalker решил? ты уверен? а в ИЕ6 ты смотрел, что делается... 1.6.2009, 13:04 Searcher для того, чтобы блоки с float влияли на высоту род... 1.6.2009, 16:35
Riim Цитата(Searcher @ 1.6.2009, 21:35) для то... 1.6.2009, 16:52  |
| Текстовая версия | Сейчас: 3.9.2010, 4:59 |
