0

在我的网页上，当我使用浮动时：左侧导航栏按钮（水平排列）它使内容向右移动，例如：

[ Home About More ]
                   Text

我希望它是：

[ Home About More ]
Text

有什么建议么？

4

4 回答 4

6

您需要使用clearText 中的属性。像这样：

.text {clear:left}
于 2012-10-04T13:19:57.563 回答
1

使用 clearfix 解决方案来解决问题。

http://themergency.com/css-clearfix-demystified/

更新：在 CSS 文件中，添加以下内容：

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

然后在您的 HTML 中，将该clearfix类添加到浮动元素的父容器中。不确定您的 HTML 标记是什么样的，但它可能与 clearfix 解决方案类似：

<div class="clearfix">
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">More</a></li>
  </ul>
</div>
于 2012-10-04T13:20:01.303 回答
0

这是一个非常常见的问题，我建议像这样定义一个 css 条目

.clear {clear:both;}

然后在将来，您可以简单地将此类添加到需要清除上述浮动的元素中，或者像这样简单地使用此类添加一个空 div。

<div class="clear"></div>

于 2012-10-04T13:24:28.887 回答
0

或者这适用于（溢出技巧）：

<div style="overflow:auto">
   <div style="float:left">[ Home </div>
   <div style="float:left">About </div>
   <div style="float:left">More ]</div>
</div>
Your other text
于 2012-10-04T13:25:21.217 回答