当内部div高度增加时，增加容器高度

Question

这是我的HTML和CSS

＆＃13;

＆＃13;

#container {
  width: 840px;
  padding: 30px;
  margin: auto;
  min-height: 200px;
  max-height: auto;
  border: 1px solid;
}
.content {
  width: 100%;
  min-height: 300px;
  max-height: auto;
  border: 1px solid;
  float: left;
}
.right {
  float: right;
  width: 80%;
}
.left {
  width: 20%;
  float: left;
  height: 700px;
  border: 1px solid;
}
.lol {
  border-bottom: 1px solid;
  min-height: 100px;
  max-height: auto;
  float: left;
  width: 100%;
}

＆＃13;

<div id="container">
  <div class="content">
    <div class="lol">
      <div class="left">
        LEFT
      </div>
      <div class="right">
        RIGHT
      </div>
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

请尝试在浏览器中运行它以查看输出以便更好地理解

如果内部div也增加其高度，我希望容器增加其高度。谢谢先生。

Answer 1

将overflow: hidden添加到#container。

#container {overflow: hidden}

https://jsfiddle.net/n7d5geju/