在100％容器内高度100％的Div？

Question

<div id="container">

   <div id="content">
   //my content
   </div>

</div>

#container{
 height:100%!important;
 min-height:700px!important;
}
#content{
 height:100%!important;
}

我有一个内容div的容器div，无论我做什么，我都不能让内容div与容器div的高度相同。我错过了什么吗？

由于

Answer 1

将height:100%添加到html和正文

html, body{height:100%}

<强> DEMO

---

您也可以将min-height：700px（或inherit）添加到子div。我希望它可以解决问题。

UPDATED DEMO

向内部div添加更多内容，以便在内容增加时检查height:100%效果。

Answer 2

<style>
#container{
height:700px !important;
 border:1px solid red;
}
#content{
 height:100%!important;
 border:1px solid green;
}
</style>
<div id="container">
   <div id="content">
    //my content 
   </div>

</div>

Answer 3

只需添加min-height：inherit to content style

#content{
 height:100%!important;
 min-height:inherit;
}