Internet explorer IE7垂直背景位置错误

我用精灵的背景位置来拍摄导航图像。它在chrome、safari、ff等中看起来很棒。水平属性在IE中似乎有效，但在垂直属性中却不起作用。到处都是。相反，我在不同的站点上有几乎完全相同的代码，但sprite是水平设置的

这是css。我添加了background-position-x/y作为一个潜在的修复程序，但IE似乎也不受此影响（除非WineBallerIE7安装中存在缓存错误）。我是新来的，这就可以解释这里面的任何noob东西：

#menu-item-16 a {
background-image: url("images/csg.png");
background-position: 0 -510px;   
background-position-x: 0;
background-position-y: -510px;
background-repeat: no-repeat;
background-size: 400px auto;
display: block;
height: 80px;
margin-left: 0;
margin-top: -13px;
outline: none;
padding: 0;
text-indent: -9999px;
width: 400px;
}
#menu-item-16 a:hover {
    background-position: 0 -638px;
    background-position-x: 0;
    background-position-y: -638px;
}
#menu-item-24 a {
    background-image: url("images/csg.png");
    background-position: 0 0;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    background-size: 400px auto;
    display: block;
    height: 80px;
    margin-left: 0;
    margin-top: -10px;
    outline: none;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}
#menu-item-24 a:hover {
    background-position: 0 -128px;
    background-position-x: 0;
    background-position-y: -128px;
}
#menu-item-15 a {
    background-image: url("images/csg.png");
    background-position: 0 -1025px;
    background-position-x: 0;
    background-position-y: -1025px;
    background-repeat: no-repeat;
    background-size: 400px auto;
    display: block;
    height: 80px;
    margin-left: 0;
    margin-top: -13px;
    outline: none;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}
#menu-item-15 a:hover {
    background-position: 0 -1153px;
    background-position-x: 0;
    background-position-y: -1153px;
}
#menu-item-13 a {
    background-image: url("images/csg.png");
    background-position: 0 -1282px;
    background-position-x: 0;
    background-position-y: -1282px;
    background-repeat: no-repeat;
    background-size: 400px auto;
    display: block;
    height: 80px;
    margin-left: 0;
    margin-top: -13px;
    outline: none;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}
#menu-item-13 a:hover {
    background-position: 0 -1409px;
    background-position-x: 0;
    background-position-y: -1409px;
}
#menu-item-14 a {
    background-image: url("images/csg.png");
    background-position: 0 -769px;
    background-position-x: 0;
    background-position-y: -769px;
    background-repeat: no-repeat;
    background-size: 400px auto;
    display: block;
    height: 80px;
    margin-left: 0;
    margin-top: -13px;
    outline: none;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}
#menu-item-14 a:hover {
    background-position: 0 -897px;
    background-position-x: 0;
    background-position-y: -897px;
}
#menu-item-28 a {
    background-image: url("images/csg.png");
    background-position: 0 -257px;
    background-position-x: 0;
    background-position-y: -257px;
    background-repeat: no-repeat;
    background-size: 400px auto;
    display: block;
    height: 80px;
    margin-left: 0;
    margin-top: -13px;
    outline: none;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}
#menu-item-28 a:hover {
    background-position: 0 -385px;
    background-position-x: 0;
    background-position-y: -385px;
}

---

我不得不添加一个alt样式表来调整IE的背景位置。奇怪的是，我最初使用sprite生成器来节省时间。它在自己的css上吐出的坐标与FF、Chrome等的坐标相差甚远，但它们在IE中却非常准确-比较它们。

我不得不添加一个alt样式表，只为IE调整背景位置。奇怪的是，我最初使用sprite generator来节省时间。它在自己的css上吐出的坐标与FF、Chrome等的坐标相差甚远，但它们在IE上是准确的——比较它们。

首先，background-position-x和background-position-y在Firefox中不起作用。但对于跨浏览器，其工作原理如下：

background-position-x: 300px;
background-position: 300px 0;
background-position-y: 300px;
background-position: 0 300px;

---

IE和Chrome支持background-position-x和background-position-y，但是，当您尝试在事件上更改background-position-y时，IE无法正常工作。您可以尝试使用上面的代码来替换x和y坐标的显式定位。

首先，background-position-x和background-position-y在Firefox中不起作用。但对于跨浏览器，其工作原理如下：

background-position-x: 300px;
background-position: 300px 0;
background-position-y: 300px;
background-position: 0 300px;

---

IE和Chrome支持background-position-x和background-position-y，但是，当您尝试在事件上更改background-position-y时，IE无法正常工作。您可以尝试使用上面的代码来替换x和y坐标的显式定位。

顺便说一句，上面的代码不会很好地工作，因为css代码查看的是上一个没有中断的条目

background-position: 0 0;
background-position-x: 0;
background-position-y: 0;

---

顺便说一句，上面的代码不会很好地工作，因为css代码查看的是上一个没有中断的条目

background-position: 0 0;
background-position-x: 0;
background-position-y: 0;