在最大寬度容器的Firefox中響應img

需要在具有最大寬度的容器內響應img。在最大寬度容器的Firefox中響應img

HTML：

<div class="center-content"> 
    <img src="assets/test-slider.png" alt="" /> 
</div>

CSS：

/*center-content*/ 
.center-content{ 
    position:relative; 
    max-width:1200px; 
    margin:0 auto;} 


/*img-fix*/ 
img{ 
    max-width: 100%; 
    height: auto; 
}

這個工作在-webkit罰款，但不能在Firefox ...

任何幫助，將不勝感激。

/編輯/

http://jsfiddle.net/WKHHR/

檢查火狐&鉻

來源

2013-05-31 ronni

任何演示或代碼的小提琴將不勝感激。 – Nitesh

請解釋一下沒有用的東西。 –

將瀏覽器寬度調整爲1200px下img逗留的原始大小時。在Chrome和Safarie中，它會根據瀏覽器更改大小。 – ronni

的CSS的圖像之間的差異是錯誤的，而不是

img{ 
    max-width: 100%; 
    height: auto; 
}

把

img{ 
    width: 100%; 
    height: auto; 
}

這是因爲你總是希望圖像的寬度是它的父div的100％。

來源

2013-05-31 12:46:45 MarkP

它始終是簡單的事情...工作長期以來我想，THNX相同的代碼！ – ronni

在Zurb基金會中嵌入圖像時，這也適用於我。在Firefox上，他們不會調整大小，從而突破他們的專欄。 – KingFu

這可能工作，但它不是一個普遍的答案。 'max-width'與'width'不一樣。在一般情況下，將寬度設置爲100％是錯誤的 - 不應該在全局範圍內設置寬度，只應在您明確要求的圖像上設置寬度。另一方面，將全局最大寬度設置爲100％是一個很好的默認設置。 – Larry

在最大寬度容器的Firefox中響應img

回答

相關問題