我想更多地了解CSS，现在我有一个在两个浏览器和一个名为“explorer”的程序中呈现不同的示例。这里是链接到示例页面，我试图从任何令人不安的细节清洁：http://csaladterapia.hu/example.html了解不同浏览器中图像的位置
在最新的Firefox版本的图像放置在里面字段集，因为它是float:right和其他元素clear:none。在Chrome和IE中，图像位于字段集之上。
你能帮我理解差异吗？
这是一个奇怪的一个，我不知道正确的行为是在这里。这是由于fieldset的width为95％。删除此宽度属性会在Firefox和Chrome中显示相同的行为。
如果您希望图像出现在fieldset中，则将图像移动到图例之后的第一个元素，这样您可以在所有浏览器中看到一致的行为。
Firefox试图兑现这个width，同时保持float，但似乎Chrome想要将字段集移动到一个新的行，由于是块和95％的宽度。
在这种情况下，您可以如上所述更改标记。
感谢您花时间提出解决方案 – jabal
Firefox的解释是错误的，甚至很奇怪。浮动元素从不将元素放置在其他元素之上 - 它只是将它们从文档流中取出，并将它们放在当前行的左侧/右侧。如果float之后的元素不是太宽，并且没有'clear'属性，它将被放置在同一行上。
在您的示例中，以下元素是div，默认宽度为100％，因此不能放在同一行上。
Firefox做了什么很奇怪 - 甚至清楚：留在下面的元素没有任何作用。
参考：
http://coding.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/
对我而言，图像突出了字段集的右侧，而不是完全位于字段集内。那是你想要的行为？我正在使用Firefox。另外，查看源代码，包含div的图像位于包含字段集的div上方，所以我可以看到为什么它在技术上不在其中。... –
水平对齐是因为这是真正网页的中间列。如果是这样，水平对齐是可以的。 – jabal