CSS - 右对齐花车

我还是挺绿的CSS，具有以下CSS/HTML：CSS - 右对齐花车

<input type="reset" value="Clear" style="float: right;" /> 
<input type="submit" value="Send" style="float: right;" />

产生如下的结果：

alt text http://i49.tinypic.com/10wtjdi.png

代替所需的输出：

alt text http://i47.tinypic.com/acblzm.png

改变HTML元素的顺序似乎解决了这个问题，但也是违反直觉的。

这种问题的一般解决方案是什么？

来源

2010-02-19 Alix Axel

它们按照它们遇到的顺序右移，第一个项目浮动到最右边，然后下一个项目在它之后浮动。

试试这个：

<div style="float: right;"> 
<input type="reset" value="Clear" style="float: left;" /> 
<input type="submit" value="Send" style="float: left;" /> 
</div>

来源

2010-02-19 16:38:15 Mauro

把它们放在一个容器div中，然后浮起来吗？

来源

2010-02-19 16:36:49 easement

我现在觉得很愚蠢。非常感谢缓解！ – 2010-02-19 16:39:23

没有反对地役权，但他的答案只是一种解决方法。 Mauro和其他人的回答实际上提供了有关float：right的行为方式。您可能实际上需要在某个时候知道这一点。 – Robusto 2010-02-19 17:16:28

<div style="float:right;"> 
    <input type="reset" value="Clear" /> 
    <input type="submit" value="Send" /> 
</div>

来源

2010-02-19 16:38:15 Pentium10

据我所知用浮漂在元素出现在文档中（或者更确切地说，他们被解析）的顺序打交道时是很重要的。第一个元素被layouted，然后再下一个，然后...

来源

2010-02-19 16:38:18 AxelEckenberger

“浮动”参数发送的项目的权利，只要它可以，直到碰到另一个浮动元素。因此，第一个按钮（清除）向右移动，直到它碰到包含它的盒子边缘。第二个按钮试图做同样的事情，但是已经在那里的清除按钮停止，所以停在它的左边。

这可能是反直觉的，因为项目做最终逆转，如果你漂浮他们的权利，但如果他们漂浮到左边，他们最终以相同的顺序，当您浮动它们。因此，我们不应该根据代码中的顺序来考虑float的排列方式，而应该从外向内考虑。

来源

2010-02-19 16:38:53 MidnightLightning

CSS - 右对齐花车

回答

相关问题