To pytanie ma już odpowiedź tutaj:

Wrapped in apageWrapper pojemnik, mam 3 div w kolumnie. Pierwszy (nagłówek) i ostatni (navWrapper) mają ustalone wysokości. Potrzebuję środkowego contentWrapper), aby rozciągnąć się na wysokość, aż nadrzędna strona divWrapper osiągnie maksymalną wysokość według rzutni przeglądarki).

Narysujęschema tego problemu.

Tutaj jestfiddle mojego obecnego rozwiązania. http: //jsfiddle.net/xp6tG

a tutaj kod

CSS i HTML

html, body{
  height: 100%;
}

body{
  background-color: #E3E3E3;
}

#pageWrapper{
  margin: 0 auto;
  position: relative;
  width: 600px;
  height: 100%;
}

header{ 
  display:block;
  width: 100%;
  height: 100px;
  background: yellow;
}

#contentWrapper{
  width: 100%;
  height: 100%;
  background: blue;
}

#navWrapper{
  width: 100%;
  height: 100px;
  background: green;
}

<div id="pageWrapper">
  <header>
    Header
  </header>
  <div id="contentWrapper">
    Content
  </div>
  <div id="navWrapper">
    Nav
  </div>
</div>

To prawie działa, ale powoduje zbyt wysoką wysokość, co powoduje, że pojawia się pionowy pasek przewijani