自动调整div高度以填充剩余空间

Question

我有2 div秒。我给了第一个height 70px，现在我希望2 ^nd div填满网页的剩余空间。这应该是相对于第一个div。以下是我的代码:( 2 div是header和content）

* {
  margin: 0px;
  padding: 0px;
}

#header {
  background-color: #1874CD;
  width: 100%;
  height: 70px;
}

#name {
  color: #ffffff;
  padding: 10px 10px 10px 10px;
  font-size: 35px;
  font-weight: bold;
  font-family: Calibri;
}

#content {
  background-color: #F5F5F5;
  width: 100%;
  height: 650px;
}

Answer 1

做这样的事情怎么样？ （JSfiddle example）：

#header{
    background-color: #1874CD;
    width: 100%;
    height: 70px;
    z-index: 2;
    position: relative;
}


#content{
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #F5F5F5;
    width: 100%;
    height: 100%;    
    padding-top: 70px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;   
}