Question

我有一个包含一些文本的div，它有一个带边框的背景，但由于某种原因，该框不会扩展到文本，即使是overflow：auto;这是我的盒子和图片的脚本：

.box {background：#ffdcba; border：1px solid＃f78d25;显示：块;明确：两者;保证金：4px 0px; padding-left：15px;溢出：自动; }

里面的div只是浮动，左右，并且有显示：内嵌在它们上面。下面是一张图片：

http://i45.tinypic.com/2woj1br.gif

Answer 1

浮动框不会展开以适合其内容。您需要在内容后添加清除元素。 <br>通常很好。

Answer 2

你没有指定HTML的确切结构，但我觉得你有这样的东西：

<div class="box">
    <div style="float: left">test subject></div>
    <div style="float: right">
        <div>ASD</div>
        etc...
    </div>
</div>

浮动元素会将它们从常规流中移除，并导致您看到的“溢出”。您需要在浮动部分下面添加一个非浮动元素，以强制包含div.box“展开”以包含浮动：

  <div class="box">
     <div style="blah blah" ....
     etc....
     <br style="clear: both" />
  </div>

同样，overflow: auto对你的.box样式没有任何影响，因为它没有指定任何高度或宽度 - 它自然会扩展为包含你放在那里的任何内容。要强制显示滚动条，您需要输入height或width样式，并且足够的内容超出其中任何一个限制。

CSS内容溢出开箱即用IE＆lt; 6

2 个答案: