父div要匹配最高子div的高度吗？

Question

我正在制作一个带有“页面”div 的网站，其中包含左侧 div“导航”和右侧 div“内容”。我想让“页面”div 的高度（以便背景匹配）等于最高 div 的高度，“导航”或“内容”。

我该怎么做呢？

Answer 1

像这样写

html:

<div class="page">
 <div class="navigation"></div>
 <div class="content"></div>
</div>

css:

page{overflow:hidden}
.navigation, content{float:left}

Answer 2

我猜你正在浮动其他 div，否则情况总是如此。您也可以浮动父 div，或者在父 div 末尾添加

。这些技术中的任何一种都会导致父 div 与其子 div 一样大。

编辑：哎呀，错过了结束标签:)

Answer 3

这将帮助您

HTML

<div class="page">
  <div class="navigation">i am navigation</div>
  <div class="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est maiores, ex? Mollitia assumenda veniam aliquid commodi ex, libero in quia perspiciatis sint voluptatibus soluta exercitationem quas quos repudiandae deserunt obcaecati.</div>
</div>

CSS

 .page {
  background-color: #000;
 }
 /* for clearfix*/
.page:after{
    content: "";
    display: table;
    clear: both;   
 }
 /* for clearfix end*/

 .navigation,.content {
   float: left;
 }
 .navigation {
   width: 20%;
   background-color: #cd6a51;
 }
 .content {
   width: 80%;
   background-color: #4CAF50;
 }