Question

先生，我在我的html页面中创建了一个div标签并显示了一个product.inside product_box div我有两列（lleft和right）使用float。

两个列都适合product_box，将容器分成两个垂直的一半。但是当我在右半部分输入内容时，如果内容长于一行，内容就会从div中出来。我希望我继续输入多行和它适合在右半部分内。

我想要溢出：滚动;方法或隐藏以及滚动条看起来非常糟糕。

plz提出了实现这一目标的方法。

CSS：

#content_left .product_box {
    margin-right: 10px;
}


.left {
    float:left;
    padding:10px;
    width:178px;
    height: 174px;
}


.right {    
    float:left;
    padding:10px;
    text-align:left;
    width: 396px;
    height: 136px;  
}

HTML：

<div class="product_box">
   <h3>Product Title</h3>
   <div class="left">some content here</div>
   <div class="right">
     jhkdjfhkjhkjhkjhkhkhkhkjhkjhkjhkjhkhkhkh
   </div>         

   <div class="cleaner"></div>
</div>

Answer 1

您可以使用min-hieght代替height来确保它获得最小高度，并在内容增加时增长...

并且确保在浮动div之后添加浮动更清晰如：<div style="clear:both"></div> ...以使父容器达到其高度

Answer 2

在div的末尾添加一个元素，样式为clear：both; （也许身高：1px;）

css div的问题

2 个答案: