Не понял что Вы хотите сделать. ;) Перечитал более 5 раз.
Вот эти строчки,не имеют смысла:

body {min-height:100%; height:auto !important; height:100%;}

Что это? :huh:

 body {position:relative;}

html {margin:0; padding:0; width:100%; height:100%; }

Oyeme
А как правильно?
Если просто:
html, body, div {height:100%} - я не получу того результата, как мне надо.

Ну вот:
http://my.jetscreenshot.com/7950/20111117-nvwr-84kb
Он не тянется на всю высоту
П.С. это я пролистнул немного вниз. 100% видимого экрана становится, а не всего документа. Вот тут видно, как видимая часть при открытии заканчивается и всё.

inpost, рекомендую вам поставить фиксированную ширину и авто-высоту для всех дивов, как родительских, так и вложенных. Вот пример:

<div class="red">
  <div class="green">
    <div class="yellow">Тут текст, который будет растягивать все остальные дивы</div>
  </div>  
</div>

div.red
{
  overflow: hidden;
  background: red;
  width: 600px;
}
div.green
{
  overflow: hidden;
  display: block;
  margin: 120px;
  background: green;
  width: 300px;
}
div.yellow
{
  overflow: hidden;
  position: relative;
  background: yellow;
  margin: 100px;
  width: 100px;
  height: auto;  
}

Отсутствие ограничений по высоте для всех дивов позволит каждому из них автоматически растягиваться в высоту в ответ на растягивание своего потомка. Высота при этом остаётся неизменной.
Удачи)

ancient mariner
http://my.jetscreenshot.com/7950/20111117-is6u-72kb
Видишь, снова не на всю высоту теперь. А это значит, что футер не будет прижат к низу.

Залей на хостинг свою верстку, проще в дебагере поправить и здесь написать что исправлено

Футер можно сделать в качестве отдельного дива, самым последним:

<div class="footer">Футер</div>

div.footer
{
  clear: both;
  width: 100%;
  position: relative;
  margin-top: 50px;
  background: cyan;
}

inpost, высоту в % тут задавать бессмысленно, если надо - указывай явно в пикселях, хотя для чего это нужно - хз)

ancient mariner
У меня фон идёт из футера вверх. Фон размером в 300-400 пикселей, он же должен находиться под текстом, который идёт в центральном блоке. Вешать на футер нельзя, потому что футер будет сверху содержания, а надо, чтобы был снизу.

EvilDev
Сейчас выставлю.

сделайте в <td></td> внизу background-image по всему блоку background-color ,а вверху в нем
добавте div.
Других способов пока не вижу ,как сделать то ,что вы хотите.
Вообще дивы очень плохо на резине работают,их чаще применяют на фиксированой верстке.

bodja
Если бы css мог налаживать одновременно 3 фона, то проблем бы не было, а так проблема в том, что каждый последующий фон должен ложиться выше предыдущего так, чтобы последний третий как раз и был на всю высоту.

То есть ты предлагаешь 3 таблицы делать с высотой 100% ?

Дивами верстается все, даже формы. Сейчас таблицы в верстке практически не применяются.

А именно что ты хочешь сделать.
Я обычно по скрину эскизу орентируюсь что да как.

у нас есть правило, что в конце страницы, абсолютно в конце есть задний фон,который нужно вставить в 3-ий слой, потому что первые 2 слоя тоже имеют фон (3-ой фон).
Фон имеет размеры около 400-500px снизу вверх. При этом он должен распологаться абсолютно внизу, даже если на странице содержанием может быть 1 строчка, а может быть 1000 строк, всё равно фон в конце.

inpost
Ты на хостинг будешь выкладывать или нет?

>> у нас есть правило, что в конце ...
еще посмотри в сторону z-index

EvilDev
Вот ссылка. http://amarket.su/test27.php
Есть средняя точка, id="all" , у неё min-height:100%, поэтому этот блок пошел на всё высоту экрана.
Если мы хотим использовать второй и третий фон в данном случае на всю ширину экрана - то мы применяем его к дочерним <div>. Вот допустим там сразу вложен пустой див, к нему делаем фон - получаем 100% экрана.
А теперь смотрим вторую ситуацию, когда содержательной части данных на экране очень мало, достаточно в строчке: <div style="padding-bottom:1000px"> - убрать padding-bottom (это для примера). И мы получаем, что ФОН дочерних дивов (относительно id="all") не тянется на всю ширину, а лишь по занимаемой там данными информации. В таком случае фон мы применяем к РОДИТЕЛЬСКИМ <div> которые до min-height:100% выставлены просто height:100%. Итого получаем - что фон тянется на всю ширину.

В данном примере всё зависит от наполнения, и в связи с этим приходится фон применять ЛИБО к дочерним, ЛИБО к родительским элементам. А я же не знаю, как будет на экране информация занимать, поэтому надо что-то конкретное выбрать-найти.

inpost - я вот не понял, что же ты хочешь получить:

height:auto !important; height:100%;

И вообще по описанию не до конца понял, что надо. То у тебя ширина в процентах, то она фиксированная для какого-то из объектов.

Плюс к этому, класс "body" сбивает с толку. И какая-то смесь стилей прямо у объектов и классов... Ты уж определись, что лучше, что ли :)

inpost
Не совсем понял, точнее не понял вообще)
Тебе надо подвал к низу прижать?

ЗЫ Не правильно id-шники юзаешь, надо классы. Я обычно id только для скриптов указываю

inpost
Ну вот примерно в этом духе,колор специально затемнил,что бы было понятней.
смотрим

инпост - вот тут моя работа в конкурсе графики http://phpforum.su/index.php?showtopic=28500, там есть и коды, и ссылка на саму работу.
Правда, там используется таблица для "глобальной" разметки, из 2-х строк по 2 ячейки в каждой. Но зато она реально "резиновая", во весь экран. А уже внутри ячеек таблицы можно делать "по современному", ДИВами.

Сделал типа кроссбраузерно
смотрим

Ну прямо таки настоящий конкурс по вёрстке.

А я без таблици и тоже кросброузерно.
очень Кросброузерно-Просто-Супер-Два фона ПНГ и внизу независемо от контента

Назначаю себя ГЕНИЕМ

bodja
http://my.jetscreenshot.com/7950/20111118-edka-164kb
FF, подвала нет. То при отсутствии информации - не на весь экран фон.

У нас есть 3 фона, все 3 фона надо растянуть на 100% абсолютно. Вне зависимости от содержания И каждый фон будет послойно.

sebastjan
fon4, который должен был быть футером по логиче того, что я увидел в начале - теперь вверх убежал
http://my.jetscreenshot.com/7950/20111118-isa7-74kb

Ну вотпришол Инпост и всё усложнил.
Понимаю так.
Три слоя на 100% у каждого фон в подвале независемо от контента -так понимать?

sergeiss
Чуть позже попробую Там надо к себе твоё скопировать Потому что визуально кажется, что при таком виде у меня как раз есть в распоряжении <table>,<tr>,<td> - достигну 3-х слоёв фона (100%)

sebastjan
Футер отдельно, его к низу прижать. Фоны отдельно. Всего я посчитал - у меня 2 фона занимают 100%. Второй фон, который занимает 100% -> он будет распологаться просто снизу (bg-pos:bottom) без repeat-y

inpost
Подвал прижимается так.
Берется основной блок, у него выставляется height:100% и в нем же создается еще один div высотой с футер. Далее под основным блоком, располагаем футер, и делаем у него margin-top:-высота фетура

EvilDev
Подвал сделать не проблема Это же понятно, основной вопрос как раз в многослойности фонов.
Кстати, я слышал, что css3 уже позволяет накладывать фоны, и хватило бы мне даже одного <div>

И снова, убили подскакивание фона.
убили подскакивание фона

А вот чтоб ещё загнать туда блоки с фонами и чтоб не прыгали - это уже задачка.
Но теоретически возможно.

EvilDev подвал с отрицательным позиционированием. Но это не совсем гибко,
хотя тоже можно.
Но тогла не будет текст из тела страницы накладываться на фон, так как подвал отрезан от тела.

Если всё дело было бы в шапке страници - то конечно без проблемм, настелил бы всё относительно . а когда речь идёт про подвал с многослойностью, вот тут начинаються пляски.
Хотя по идеи можно подвалу дать свой бг-фон, в подвал всунуть относительно релатив слой с ещё фоном а туда ещё в абсолюте от релатива слой всунуть.
А вообще - хорошо бы увидеть саму картинку дизайна, может всё без таких манипуляций можно сделать.

sebastjan
Я ранее сказал, высота подвала не более 150px, фон идёт переходящий чуть ли не 400px, растягивать на весь подвал нет возможности, иначе снизу будет 400px пустые.