divの適応高さは残りの高さを自動的に埋めます

<div class="outer">
    <div class="A">ヘッダー DIV </div>
    <div class="B">下の DIV</div>
</div>

html,
本文 { 高さ: 100%; パディング: 0; マージン: 0; }
.outer { 高さ: 100%; パディング: 100px 0 0; ボックスのサイズ設定: ボーダーボックス; 位置: 相対; }
.A { 高さ: 100px; 背景: #BBE8F2; 位置: 絶対; 上: 0; 左: 0; 幅: 100%; }
.B { 高さ: 100%; 背景: #D9C666; }

<div class="outer">
    <div class="A">ヘッダー DIV</div>
    <div class="B">下の DIV</div>
</div>

html,
本文 { 高さ: 100%; パディング: 0; マージン: 0; }
.outer { 高さ: 100%; パディング: 100px 0 0; ボックスのサイズ: ボーダーボックス; }
.A { 高さ: 100px; 余白: -100px 0 0; 背景: #BBE8F2; }
.B { 高さ: 100%; 背景: #D9C666; }