Некорректная работа свойства height

[novickOk]

Задаю абсолютно позиционированному контейнеру height: 100%, но блок растягивается только на видимую часть экрана, если прокрутить вниз, то видится неприглядная картина - http://img96.imagesh...6/8503/mqzq.png Здесь красный блок абсолютно позиционирован, а зеленый блок - содержимое, которое красный блок должен закрывать собой

[Zverushka]

Надо поставить

html, body {
height: 100%
}

[antonKar]

Красному блоку:

top: 0;
bottom: 0;

[novickOk]

Надо поставить

html, body {
height: 100%
}

Красному блоку:

top: 0;
bottom: 0;

Ничего не сработало. Чтобы было понятнее выложил код на jsfiddle http://jsfiddle.net/yAxUC/

Edited July 17, 2013 by novickOk

[antonKar]

А так не подойдёт? http://jsfiddle.net/6Z5un/1/

[Nira]

Необходимо, чтобы высота красного блока составляла именно 100%? Если задать ему высоту, равную величине зеленого блока, т.е. 2500px, проблема решается.

[antonKar]

Если задать ему высоту, равную величине зеленого блока, т.е. 2500px, проблема решается.

С вероятностью в 99,9% можно сказать, что высота в 2500 пикселей задана просто для примера. И блок на самом деле с динамической высотой.

[Nira]

Вот, вроде нашла решение. Красный блок нужно позиционировать относительно зеленого блока. Зеленому присваивается значение relative, а красному - absolute. Тогда все работает.

http://jsfiddle.net/Allangell/NeRgC/

[antonKar]

Вот, вроде нашла решение. Красный блок нужно позиционировать относительно зеленого блока. Зеленому присваивается значение relative, а красному - absolute. Тогда все работает.

http://jsfiddle.net/Allangell/NeRgC/

Собсна это я и предлагал

[Nira]

Собсна это я и предлагал

Пардон, невнимательно просмотрела

Edited July 18, 2013 by Nira