html - div 不换行 - IT工具网

这是一种更有效的方法...出于某种原因，我觉得这是一种古老的方法。

我有这个页面HERE (我正在为类(class)重新创建一个 lynda.com 网页) 并且包装器实际上并没有环绕 id="trailInfo" 部分。

为了做到这一点，我会添加 br class="br_clear"/

有没有更正确的方法呢？如果我将 clear=both 添加到该部分不起作用，我必须将其添加到 br。谢谢!

最佳答案

使用 overflow:hidden 更新您的 CSS父 div 中的属性

#wrapper {
    background-color: #FFFFFF;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    width: 960px;
}

Explanation About Clearing floats

基于 float 的 布局的一个常见问题是父 div 不想向上拉伸(stretch)以容纳子 float div .如果要在 parent div 周围添加边框，则必须以某种方式命令浏览器一直拉伸(stretch) parent div。

现在看看您面临的问题:demo

那是因为你当时没有清除 float 。

所以这个问题的旧解是clear:both;

如果您将在 child floated 元素之后添加额外的 div，如下面的代码将清除 float :

<div class="parent">
  <div class="left-child"></div>
  <div class="right-child"></div>
  <div style="clear:both;"></div>
</div>

新解决方案是overflow:hidden; 如果你愿意给overflow:hidden给你的parent div这将自动清除 父 div 内的所有子 float 元素。

查看新解决方案演示: tinkerbin.com/WKqFS7Lc

关于html - div 不换行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12263399/

html - div 不换行