html - 如何绝对定位元素相对于页面而不是 float 父元素？

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 中，这工作得很好。在 Explorer 和 Safari 中，绝对定位的 div 被 float 上的边距向下推；我无法让它到达顶 Angular 。

有什么解决办法吗？我仅限于 CSS - 不更改 HTML，不使用 javascript。

Answer 1

规则是绝对定位的子元素将相对于最近的定位父元素放置。所以，尝试:

body { position: relative; }

查看 float 的 div 并查看 float 后设置的 position。