CSS 100% wysokość pojemnika z min-wysokości

Question

Mam sytuację, w której staram się, aby element zajmował 100% wysokości jego kontenera - a element kontenera ma tylko minimalną wysokość. Niestety, kiedy to zrobię, dyrektywa wysokości zostanie zignorowana. Here is an example. "B" div, czerwony, powinien wypełnić cały rodzic. Nie, nie w IE7, Chrome ani FF3.6.

Gdybym miał "wysokość: 1 piksel" do pojemnika, "a" div, a następnie "b" jest rozciągnięty na całą wysokość "a". See here. Ale to tylko w FF3.6 i IE7, a nie w Chrome. Więc myślę, że robię coś złego tutaj.

Mam wrażenie, że jest to powszechny problem, który musi być rozwiązaniem, którego po prostu nie widzę. Jaki jest najlepszy sposób, aby osiągnąć w tym przypadku rozciąganie do wysokości?

Answer 1

Twój CSS oznacza, że ​​wysokość elementu podrzędnego wynosi 100% określonej wysokości elementu nadrzędnego. Jeśli nie określisz wysokości dla rodzica, to 100% nic nie znaczy. Dlatego to nie działa.

Co chcesz może być osiągnięty za pomocą position:relative na rodzica i position:absolute na dziecko:

http://jsfiddle.net/57EZn/25/

To nie jest piękny, ale rozwiązanie to nie to, czego po.