圖像調整大小不工作在FireFox

我有我的代碼中包含的1080p圖像。該代碼可以在Chrome上正常運行，但Firefox上存在問題。在Firefox中圖像高度不起作用，最終使圖片佔據整個屏幕。圖像調整大小不工作在FireFox

我嘗試了不同的解決方案，但無法解決此問題。我可能錯過了一些解決方案。

下面是代碼：

#container{ 
    width:auto; 
    height:60%; 
    margin: 0 auto 0 auto; 

} 


#titleImage{ 

     max-width:100%; 
     max-height:90%; 
     width:100%; 
} 


<body> 

    <div id="container"> 
     <img id="titleImage" src="throne.jpg" /> 
    </div>

我試圖實現在這樣site所有的瀏覽器的圖像高度相似。

問候

來源

2013-09-22 Umer Farooq

請你給我們在jsfiddle或你的服務器上的例子嗎？ –

您提供的網站正在使用[CSS Media Queries]（http://css-tricks.com/css-media-queries/）。 – mdesdev

高度不起作用？圖像是否恢復原來的高度？我不能再現你的問題。它在這個jsfiddle http://jsfiddle.net/m6VBz/1/ – Chanckjh

的圖像是在Firefox不同，因爲你將高度設置爲百分比。由於您正在查看的頁面周圍的圖形用戶界面（不同的瀏覽器即使在全屏模式下也會有不同的瀏覽器高度（這是顯示URL欄/收藏夾/圖標的圖形用戶界面）

您真的不應該設置高度爲百分比。嘗試，而不是像這樣

#container{ 
    width: 60%; 
    height: auto; 
    margin: 0 auto; 
}

調整寬度，以你的願望。使用的jsfiddle Chanckjh創建它會在70％左右。正如你可以在更新的jsfiddle看到的問題是固定的在瀏覽器之間。

http://jsfiddle.net/m6VBz/19/

希望這有助於！

來源

2013-09-22 22:00:58 BlueIceDJ

圖像調整大小不工作在FireFox

回答

相關問題