Question

我有一些用javascript动态插入的html。我有position:absolute;，因此它不会影响页面元素的布局。但是，当页面顶部出现flash消息时，除了绝对定位的元素外，所有元素都会向下移动。所以我似乎想要结合绝对和相对定位的属性。我该怎么做？

Answer 1

将position:relative;添加到您认为描述为“页面”的最高级别元素。例如：

<body>
    <div id="popup>
        <!-- "flash" popup message is inserted into DOM here -->
    </div>
    <div id="main content" style="position:relative;"><!--THIS IS "THE PAGE"-->
        ...
            ...
                <!-- your "absolutely" positioned element -->
            ...
        ...
    </div>
</body>

编辑：这是thirtydot的优秀演示，完美地说明了这一概念：http://jsfiddle.net/qGTw6

Answer 2

将position: relative添加到绝对定位元素的父元素。

确保您的“Flash消息”超出此元素。

CSS定位问题

2 个答案: