0

我的图像幻灯片在 chrome 和资源管理器上都显示在正确的位置，但在 Firefox 中却没有。图像正确放置在 slideshow_box 内，但在 Firefox 上，它们位于浏览器的右上角。幻灯片使用 javascript 工作。

有谁知道这是为什么？

html代码：

 <div id="slideshow_box" class="clear">
           <div class="slides">
                <ul>
                    <li><a href="#"><img src="images/buses.jpg" alt="bus in clydebank" </a></li>
                    <li><a href="#"><img src="images/school_work.jpg" alt="school" </a></li>
                    <li><a href="#"><img src="images/haven.jpg" alt="the haven kilmacolm" </a></li>
                </ul>
           </div><!--slides-->   
  </div><!--slideshow_box-->

的CSS：

#slideshow_box { 
background: url(../images/slideshow-box.png) no-repeat; height: 312px;  margin: 20px auto;
}

#slideshow_box .slides ul { 
list-style:none; position:relative; bottom: 50px; left: 40px; width: 750px; height: 250px; overflow: hidden;
 }

任何帮助将非常感激 ：）

4

2 回答 2

2

替换为您的 img 标签

替换这个

<li><a href="#"><img src="images/buses.jpg" alt="bus in clydebank" </a></li>

进入这个

<li><a href="#"><img src="images/buses.jpg" alt="bus in clydebank"/> </a></li>

这是jsfiddle

于 2013-04-26T09:03:48.917 回答
0

.slides ul和 的高度#slideshow_box差为62px。如果要使.slides ul容器内部居中，则底部值应位于31px. 顺便说一句，我认为如果你也定义宽度值会更好#slideshow_box。

于 2013-04-26T09:16:25.057 回答