幻燈片顯示在Firefox上的錯誤位置的圖像

我的圖像幻燈片顯示在鉻和資源管理器上的正確位置，但不是與Firefox。圖像正確放置在幻燈片放映框中，但在Firefox上，它們位於瀏覽器的右上方。幻燈片使用JavaScript。幻燈片顯示在Firefox上的錯誤位置的圖像

有沒有人有任何想法，爲什麼這是？

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; 
}

任何幫助，將不勝感激:)

來源

2013-04-26 ricky

替換成您的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-26 09:03:48

謝謝，但解決了我的浮動框在ie中的顯示問題。多數民衆贊成在使用過渡而不是嚴格的事情，我想大聲笑。幻燈片仍然顯示在右上角！ – ricky 2013-04-26 09:27:33

你能檢測到任何其他方式，Firefox的顯示不正確嗎？檢查上面的評論。謝謝 – ricky 2013-04-26 10:21:06

的.slides ul和#slideshow_box通過62px有高度差。如果要將.slides ul居中在容器內，則底部值應爲31px。順便說一下，我認爲如果您還爲#slideshow_box定義寬度值會更好。

來源

2013-04-26 09:16:25

#slideshow框是831px寬。我已經添加了這個，並嘗試將底部值更改爲31px，但在ie和chrome中進行了修改。圖片仍然位於瀏覽器窗口的右上角 – ricky 2013-04-26 09:35:12

幻燈片顯示在Firefox上的錯誤位置的圖像

回答

相關問題