css - 更改导航栏图像的 CSS 以适应 IE

Question

我的水平导航栏填充了来自包含所有子图像的一个图像的链接图像；每个导航项图像都由较大图像中的像素位置标识。这在 Firefox 和 Safari 中工作得很好，但在 IE 中，所有图像在导航栏中都错放得太低(只能勉强看到文字的顶部)。两个问题:

• 如何在 css 中修复此问题，使其与 IE 的更新版本(和当前版本)向后兼容
• 我需要单独的 IE 样式表吗？

这是 css(仅针对一些链接进行了截断):

ul#navbar {
    width: 750px;
    height: 22px;
    margin: 0px;
    padding: 0px;
    text-indent: -9999px;
    border: none;
}
ul#navbar li {
    float: left;
    height: 22px;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    border: none;
    /*position:absolute;*/
}
ul#navbar li a {
    display: block;
    height: 22px;
    border: none;
}

.home {
    left: 0px;
    width: 78px;
    background-image: url(../images/nav/new_nav.jpg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.classes {

    /*left: 78px; */
    width: 92px;
    background-image: url(../images/nav/new_nav.jpg);
    background-repeat: no-repeat;
    background-position: -100px 0px; 
}

.训练{ 左:170px； 宽度:89px； 背景图像:url(../images/nav/new_nav.jpg)； 背景重复:不重复； 背景位置:-200px 0px；

Answer 1

我为 IE 6 使用 *.html

/** 对于 IE6 / *html #related-products { 宽度:300px； 溢出:可见；
} *html #related-products ul { 职位:相对； 左:-65px；
} *html #related-products li { 边框:无；
} / IE6 hack 结束 **/

否则会有 IE 条件注释。

http://www.quirksmode.org/css/condcom.html

至于单独的样式表，你可以创建一个让你的服务器端语言检测浏览器，如果 Internet Explorer 确保你的 IE 被添加，否则你可以将它们添加到现有的 CSS 文件中。这两个我都做过。