HTML-макет с высотой 100% высоты

Question

Мне нужна помощь с определенной проблемой. По сути, мне нужен div с таблицей внутри него с div в ячейках и т. Д. Кроме того, мне нужно, чтобы самый внешний div имел высоту и ширину 100% (охватывает всю страницу) и потомки, чтобы вычислять их высоту соответственно, за исключением те div, высота содержимого которых больше их (они должны показывать полосу прокрутки)

Я подготовил скрипку с тестовой страницей:

http://jsfiddle.net/S2YSh/6/

Пока что только Google Chrome показывает это, как я планирую, IE не рассчитывает отступы и поля на высоте 100%, а Firefox растягивается с содержимым (без полосы прокрутки)

Если кто-нибудь может мне помочь (желательно с той же HTML-структурой), это будет очень признательно.

Answer 1

Попробуйте это:

<div style="height:100%;width:100%;position:absolute;top:0;left:0;">
  <table>...</table>
</div>

Answer 2

Вы можете сделать это так:

.right{
    float:right;
    width:200px;
    height:100%;
    background:red;
}
.left{
    overflow:hidden;
    background:green;
    height:100%;
}
.right, .left{
padding:20px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

html, body{
    height:100%;
}

Проверьте это http://jsfiddle.net/S2YSh/9/