Html CSS两列正在破坏我的布局

我有一个动态加载数据的页面。我把图片放在左边，一些文字放在右边。使用float在两列中：左； 这可以很好地工作，但包含div的高度不会更改以匹配较大div的高度

我有过这样的经历：

<div class="container">
   <div class="left">//some php to load image</div>
   <div class="right">//loaded text</div>
</div>

.container{
   width:800px;
   height:auto;
}
.left,.right{
  float:left;
  height:auto;
}
.left{
   width:300px;
}
.right{
   width:500px;
}

//一些php来加载图像
//加载的文本
.集装箱{
宽度：800px；
高度：自动；
}
.左，.右{
浮动：左；
高度：自动；
}
.左{
宽度：300px；
}
.对{
宽度：500px；
}

---

div相邻，但包含div的div只会调整到最小div的高度。它不应该调整到最大div的高度吗？

将

溢出：自动
添加到
.container
元素。
将
溢出：自动
添加到
容器
元素。
我认为这是一个典型的例子
clearfix
问题

阅读这里有关clearfix的内容：
我认为这是一个典型的
clearfix
问题

阅读这里有关clearfix的内容：
您需要将您的float设置为两个组合，清除float并将overflow:auto添加到容器中。谢谢大家。你需要调整你的浮动。两者的结合很好，清除浮动并将溢出：自动添加到容器中。谢谢大家。这是有效的，但肯定那只是增加了一个卷轴bar@PaulLedger，它没有添加滚动条。它只会将容器扩展到子元素的高度。。只有手动设置容器的高度时，才会出现滚动条。这是可行的，但肯定是添加滚动条的原因bar@PaulLedger，它没有添加滚动条。它只会将容器扩展到子元素的高度。。只有手动设置容器的高度时，才会出现滚动条。。