css - 为什么 Firefox 和 IE 不将图像完整地放在一个 li 中

Question

我想将图像放置在幻灯片中（两个单独的滑块）并为此使用 li……它在 Chrome 和 Safari 中运行良好，但在 Firefox 和 IE 中存在问题

在 Firefox 中，它在 quirks 模式下工作正常，但在标准模式下不起作用：请参见以下示例：

怪癖模式适用于 Firefox： http: //www.newmen-agency.com/

但在标准模式下不起作用：http: //www.newmen-agency.com/index_doct.html

我必须在标准模式下工作……我做错了什么？

见下面的CSS代码：

/* Photo slider */

#slider1 {
    position: absolute;
    height: 100%;
    left: 0%;
    top: 0%;
    width: 57%;
    z-index:100;
}    

#slider2 {
    position: absolute;
    height: 100%;
    left: 82%;
    top: 0%;
    width: 57%;
    z-index:100;
}

#slider1 ul, #slider2 ul {
    margin: 0;
    padding: 0;
}

#slider1 img, #slider2 img {
    height:100%;
}

Answer 1

添加一个最大宽度似乎有帮助（顺便说一句，Opera 不喜欢这两个版本的页面）：

#slider1 img, #slider2 img {
    height:100%;
    max-width:100%;
}