Сила вложенных divs имеет минимальную высоту 100%?

Я знаю, что min-height: 100% будет работать только на 100% высоты его родительского элемента, если родительский элемент имеет некоторое числовое значение для высоты, но что, если у меня есть несколько вложенных div, и я хочу, чтобы они все иметь минимальную высоту 100%? Я попробовал min-height:inherit, но это тоже не сработало? Я знаю, что, возможно, я могу решить эту проблему с помощью JavaScript, просто проверив значение высоты браузера при загрузке документа, а затем назначив это свойство min-height моих вложенных div, но я хотел бы знать, можно ли решить эту проблему с помощью только css?

Изменить. Я должен также упомянуть, что мне нужно, чтобы мой внешний div и мои вложенные divs имели минимальную высоту 100%, чтобы они занимали хотя бы высоту браузера, но при необходимости развернуть.

Ответ 1

min-height: inherit; должен работать: http://jsfiddle.net/ugxbs/

ИЗМЕНИТЬ

Что касается процентных значений и ожидаемого поведения, логика заложенной минимальной высоты не существует. Вы должны использовать свойство height для всех родителей, а затем добавьте минимальную высоту к самой внутренней DIV.

f.ex:

<html>
    <body>
        <div class="outer">
            <div class="inner"></div>
        </div>
    </body>
</html>

CSS

html, body, .outer { height: 100% }
.inner { min-height: 100%; }

http://jsfiddle.net/4PsdT/

Таким образом, вы сообщаете обозревателю, чтобы все внешние элементы были сверху (HTML) на высоту 100%. Это заставит эти элементы растягиваться по высоте браузера. Затем просто добавьте min-height к самому внутреннему элементу, содержащему контент.

Установка a height не означает, что чрезмерное содержание дочерних элементов выпадет, если вы не добавите overflow:hidden;.

Ответ 2

Я могу заставить его работать с высотой свойства, но не с минимальной высотой.

http://jsfiddle.net/zDVqm/