如何绝对定位元素而不是浮动父元素？

Question

我正在为一个页面编写CSS，不幸的是，我对我可以改变的内容非常有限。我得到的情况是，我想要绝对位于页面左上角的div位于div样式float: left;

内

<style>
.float {
    float: left;
    margin-top: 100px;
}
.absolute {
    position: absolute;
    top: 0;
    left: 0;
}
</style>

<div class="float">
    <div class="absolute">
    </div>
</div>

在Chrome和Firefox中，这很好用。在资源管理器和Safari中，绝对定位的div被浮动上的边缘向下推;我不能让它走到顶角。

任何想法如何解决这个问题？我只限于CSS - 没有改变HTML，没有javascript。

Answer 1

规则是绝对定位的子项将相对于最近的定位父项放置。所以，试试：

body { position: relative; }

查看浮动的div，看看浮动后position设置为什么。