css - 为什么在ie中,绝对定位的标志是在右边?

标签 css image internet-explorer firefox css-position

这是我的 CSS 代码:

#header {
    width: 900px;
    margin-left: 0;
    position: relative;
    text-align: left;
    clear: left;
    float: left;
}
#logo {
    z-index:-1;
    position:absolute;
}

和 html...

<div style="text-align: center;">
    <div id="wrapper">
        <div id="header">
            <!--Logo-->
            <div id="logo"> <a href="http://projectstratos.com/" title="Home"><img src="logo-transparent.png" border="0"></a>
            </div>
            <!--End Logo-->
        </div>
    </div>
</div>

Logo 需要保持绝对并在我的内容之下。在 firefox 中它看起来很棒,但在 ie 中, Logo 位于右侧而不是左侧。我正在使用中心 div 而不是居中的边距方法,因为它不起作用!

我怎样才能把它移到左边?

最佳答案

如果它需要从中心偏移并且您知道 Logo 的宽度,那么您可以设置宽度,将 left 设置为 50%,并使用负边距使其居中。然后一旦居中,您就可以添加边距以获得您想要的距中心的偏移量。

例子:



#logo {
    position:absolute;
    left:50%;

    margin-left:-250px; /* This negative margin gets the logo in the centre */
    /* Adjust this value to get the offset you want. If you want to have it 100px to the left make it -350px, if you want it 50px to the right make it -200px */

    width:200px;
    z-index:-1;
}

关于css - 为什么在ie中,绝对定位的标志是在右边?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4878041/

相关文章:

从一台服务器添加 JQuery Sizzle 属性

internet-explorer - 互联网浏览器测试

jquery - 单击更改 flash.width

javascript - 常见问题页面。显示和隐藏内容,JQuery 和 CSS 问题

image - Xamarin.Forms iOS 图像不显示

html - Internet Explorer 8 不为具有相同类的两个元素加载 CSS 的问题

javascript - 如何使滚动箭头在顶部和底部消失? JavaScript

html - 鼠标悬停背景 "highlight"覆盖文字

html - 我网站导航栏的标志消失了

javascript - 点击时图像在上方移动 1px