图像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

回答

相关问题