我有一些 html 代码，看起来像这里的示例:
<html>
<body>
<div id="A" style="float:right; Background-color: Red;">Alpha</div>
<div id="B" style="margin-top: 20px; Background-color: Green;">Bravo</div>
</body>
</html>
我想要实现的是让 A div 位于右上角，B div 位于页面顶部左侧 20 像素处。正如您在下面看到的，它在 IE8 中完全符合我的要求，但在 Chrome 和 Firefox 中效果不佳。
因为这种情况经常发生，我认为 Chrome 和 FF 以这种方式呈现它是正确的，而 IE8 不遵循该标准。所以我的问题是如何在所有浏览器中获得所需的结果(IE 在 SS 中的作用)？
编辑 1 和 2:我编辑了屏幕截图以显示我真的希望 Bravo div 位于 Alpha div 的左侧 但低 20px 而不是像我简单地添加一个清晰的那样在它下面: 就在 Bravo 上。
谢谢
最佳答案
编辑
新问题的答案:
<div id="A" style="float:right; background-color: Red; margin-top: -5px;">Alpha</div>
<div id="B" style="margin-top: 20px; background-color: Green;">Bravo</div>
原创
(问题作者原来问这个，后来改了问题...)
将 clear: right; 添加到 B div 的样式中。可选择使用 clear: both;。并将 div A 包装到包装器 div 中，如下所示:
<div id="wrapper" style="overflow: hidden;">
<div id="A" style="float:right; background-color: Red;">Alpha</div>
</div>
<div id="B" style="margin-top: 50px; background-color: Green; clear: right;">Bravo</div>
关于css - 我怎样才能防止 float 的 div 继承他 sibling 的 margin-top？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8154091/