圖像div設置爲高度：100％但不擴展至100％ - 試圖避免100vh

我遇到了問題，圖像div未擴展到height: 100%。圖像div設置爲高度：100％但不擴展至100％ - 試圖避免100vh

html,body和wrapper設置爲height: 100%。

下面的代碼是什麼我目前正在使用：

.blogimgcont { 
width: 100%; 
height: 100%; 
} 

.blogimgcont img{ 
height: 100%; 
width: 100%; 
}

100vh不會使圖像佔據整個垂直高度，但恐怕運行到使用它的跨瀏覽器兼容性問題。

任何人都可以指出爲什麼身高：100％不工作？

請查看http://protein.guru/澄清

編輯：

我決定無論如何要使用100vh - 謝謝你的答案

來源

2016-01-12 jmcgee

如果.blogimgcont沒有父母指定的寬度，那麼你有100％的任何東西;） –

@BinaryGhost如果.blogimgcont是身體的孩子，身體需要一個高度設置...否則那裏n o有效的值繼承並傳遞給img ...基本的CSS規則沒有什麼更多或更少;） –

只有'height：100％'，你將無法達到你正在尋找的效果。這個問題，你可以看到這個，如果你檢查你的父元素，設置高度爲百分比沒有設置它相對於視口的高度，但它的容器。但是，由於集裝箱沒有設置明確的高度，所以它假設其子集的高度。這意味着您可以將圖像設置爲其父容器的100％，但父級的大小不正確（不是視口的100％，而是其子級的100％）。 – ingridly

試試這個

.blogimgcont { 
    width: 100%; 
    height: 100%; 
    position: relative; 
    top: 0; 
    bottom: 0; 
}

來源

2016-01-13 04:58:46

圖像div設置爲高度：100％但不擴展至100％ - 試圖避免100vh

回答

相關問題