定位绝对 div 的问题答案

【问题标题】：Issue with positioning an absolute div定位绝对 div 的问题
【发布时间】：2013-01-26 05:45:08
【问题描述】：

大家好，我在设置导航样式时遇到问题，因此无论使用哪种浏览器，导航栏始终位于页面上的相同位置....

我有以下几点：

#Mainmenu {
    width: 44%;
    font-family: Helvetica, Arial, Sans-Serif;
    font-weight: bold;
    font-size: .9em;
    list-style: none;
    position: absolute;
    left: 35em;
    top: 4.7em;
    right: 0;   

}

这是定位，正是我想要它在 chrome 和 firefox 中但不是在 IE 中的位置。此外，如果我改变分辨率，它会稍微改变定位。我想知道如何才能始终将它放在应有的位置。

如果您还需要什么，请告诉我！

大卫

更新：

http://jsfiddle.net/MVpkP/ - 是我在其中的样式和布局。

上面那个是 Chrome，我希望它保持原样，这就是我想要的样式。

【问题讨论】：

你能把它弄乱，以便我们在 IE 中测试它吗？
你想要什么信息？
只要把代码jsfiddle.net放在这里，我们就可以测试一下了……
@arpitSrivastava 我添加了它，但它看起来并不是这样。
@ArpitSrivastava 我刚刚添加了图片

标签： html css coding-style styles stylesheet

【解决方案1】：

把它放在你的标题中

 <!--[if IE]>
   <link rel="stylesheet" type="text/css" href="IE.css" />
 <![endif]-->

为 IE 创建一个额外的 css 文件并相应地调整您的 IE css。

【讨论】：

【解决方案2】：

您应该在左/右/上使用 %，或者将此元素放在另一个元素中。

例如：

#Mainmenu {
width: 44%;
font-family: Helvetica, Arial, Sans-Serif;
font-weight: bold;
font-size: .9em;
list-style: none;
position: absolute;
left: 3%;
top: 1.5%;
right: 0;   
}

至于放在另一个元素中：

#wrap{
width: 700px;
margin:0 auto;  
 }

<div class="wrap">
     your menu stuff...
</div>

其中任何一个都可以解决您的问题

【讨论】：

最上面的那个不适合我...你是什么意思的环绕的？
如果你设置了一个包装元素。然后在内部元素上使用绝对而不说明顶部/右侧/左侧它将是绝对的，但将相对于包装器元素。如果你想改变它的位置，你可以左边/右边。
更容易吗？
这也将根据您的喜好在许多情况下需要单独的 css 文件，我只是更喜欢尝试拥有 1 个 css 文件。
是的，非常感谢您的帮助:)