Html 是否有一种方法可以将元素定位到右侧而不将其从流中移除？

我有一个div，里面有一些内联元素。我想把其中一个元素放在左边，其余元素放在右边：

+---------------------------+
|+----+      +-----+ +-----+|
|| A  |      |  B  | |  C  ||
|+----+      |     | |     ||
|            |     | |     ||
|            |     | |     ||
|            +-----+ +-----+|
+---------------------------+

我尝试在BC和C上使用

float:right

，但这会将它们从流中移除，使它们从容器中脱颖而出：

+---------------------------+
|+----+      +-----+ +-----+|
|| A  |      |  B  | |  C  ||
|+----+      |     | |     ||
+------------|     |-|     |+
             |     | |     |
             +-----+ +-----+

把东西放在右边而不让它们从外容器溢出的最佳选择是什么

---

编辑：大多数答案似乎建议使用自动溢出或清除溢出。他们之间有什么区别？我如何选择一个而不是另一个？而且，每个人似乎都认为我需要浮动元素。“浮动”是将东西放在右边的唯一方法吗？

当您浮动元素时，不会计算父元素的高度。您可以使用，也可以使用

您还可以在父div的末尾添加

，但是这与上述解决方案的语义不太一样

然而，您选择使用的实际上是个人偏好

---

此外，您可能还想尝试使用网格系统。您可以尝试或。

一个简单的解决方案是将

溢出：auto

添加到容器中以解决此问题。这将导致容器展开以包含其浮动，但如果出于某种原因，有人另外为容器设置了较小的高度，则会显示滚动条

---

还有其他的替代方案也能起作用，在其他情况下可能更好。有关该问题的详细概述，请参阅及其第二个答案。

将这一行放在后面：

这将扩展他们所在的div，以适应周围的环境

---

下面是一个示例，说明如何执行此操作。

您需要像这样清除浮动元素：

---

如果您不清除，它将是这样的：（浮动未清除）

当前浮动可能是获得所需结果的唯一方法。您也可以浮动父容器，但随后必须给它一个宽度。此方法可以快速生成“”布局，但它可以正常工作

有鉴于此，有一种（至少在我看来）比浮动修复更好的方法。使用

显示：内联块

。缺点是什么？IE7当然不支持它。不过，在IE8及以上版本和Chrome、Firefox和Opera中，下面的内容仍然有效

注意：我简化了演示的CSS，试图消除人们对这很复杂的看法。不是。

display:inline块

是您唯一需要的部分；其余部分是试图匹配问题描述中描述的OP的一部分

<div id="container">
    <div id="a">A</div>
    <div id="b">B</div>
    <div id="c">C</div>
</div>

#container {
    background: #ddd;
    text-align: center;
}
#container > div {
    background: #cff;
    display: inline-block;
    padding: 2%;
    height: 100px;
    width: 25%;
}
#container #a {
    height: 30px;
    margin: 0 10% 0 0;
}

A.
B
C
#容器{
背景：ddd；
文本对齐：居中；
}
#容器>分区{
背景：#cff；
显示：内联块；
填充：2%；
高度：100px；
宽度：25%；
}
#集装箱#a{
高度：30px；
利润率：0.10%0.0；
}

---

clearfix不能解决这个问题吗？@smilledge:什么是clearfix？用它来清除你的浮动元素

使用它不会将这两个div从流中溢出不，它们不会添加滚动条，除非你将固定高度添加到parents。这不是一个hack。应该是这样的。浮动元素和clearfixing是一种黑客行为。而这种宽度只是试图制作你正在展示的东西的副作用；如果你说的是流动性布局，那可能是可以容纳的，可能是百分比。告诉哪一个元素，以及为什么是保证金？你是对的，这是我的错，我删除了保证金属性。只需将溢出属性指定给B和C@AnkitGautam查看谁首先对问题发表了评论

overflow

属性在技术上并没有清除浮动-相反，它导致元素形成一个新的浮动，浮动可以包含在其中。这会导致容器拉伸到浮动的高度以容纳它们，因此在您强制其高度小于浮动所占的高度之前，滚动条不会出现在

overflow:auto

中。这不是唯一的方法。甚至有些人认为浮动严格来说不是正确的方式（因为它是用于文本流，而不是块流）。这就是“显示：内联块”的作用，但我认为IE7和IE8不支持它。这种方法对流体宽度布局有效吗？我正在研究。还没有获得容器的宽度，但是：仍然可以使用一些调整，但这表明它会起作用：使用内联块可以很好地替代浮动，特别是对于类似这样的东西。它可以让你对游戏中的元素有稍微不同的想法，但无论如何都不是一件坏事。@Kyomu-Clearfixing是一个黑客；这是因为

display:inline block

最初在表显示时代没有得到很好的支持。由于一个bug（IE6中数百个bug中的一个），IE6“自然”做了一些类似ClearFixed的事情，ClearFixed被视为一种可接受的方法。总有一天，上帝保佑，清理将不再是必要的。但可以肯定的是，这不是替代方案。