0

我正在维护的网站有问题，可以在此处找到最新的测试版本http://www.smithandgeorg.com.au/new/如果在 IE7-9 或 Opera 中查看，此页面将按预期显示，但是在 Firefox 和 Safari 中，菜单的位置是靠在屏幕的左侧（最好看到而不是描述）。

问题似乎源于我对定位的使用。#content元素的位置是这样position:relative; top:0px; left:0px的，当#menu元素（嵌套在里面）被定位position:absolute; left:0px时，它会被推到元素的左侧#content，就像在 IE9 和 Opera 中正确发生的那样。然而 Firefox 和 Safari 似乎忽略了#content相对定位的事实，只是向上推#menu到屏幕的左侧。

我试图在下面的简单页面中重现该问题，但一切都按预期工作。

<html>
    <body>
        <div style="border:1px solid red; width:100px; height:100px; position:relative; left:0px">
            <div style="border:1px solid black; width:100px; height:100px; position:absolute; top:60px; left:20px">
            </div>
        </div>
    </body>
</html>

任何帮助将不胜感激 ：）

4

1 回答 1

0

Firefox 通常会忽略position:relative表格元素，但这可以通过添加display:block来解决#content：

#content {
position:relative;
top:0;
left:0;
display:block;
}

关于位置的问题/答案：相对

于 2011-09-27T11:04:25.717 回答