垂直响应图像（max-height）在Firefox中不起作用 [英] Vertical responsive image (max-height) not working in Firefox

问题描述

我正在寻找一种将图片设置为浏览器窗口的100％高度的方法（底部有一个小填充），以页面为中心。

I'm looking for a way to set an image to the 100% height of the browser window (with a small padding at the bottom), centred on the page.

我已经在codepen中设置了一个例子，它在Chrome和Safari中非常有用，而在Firefox中，图片以全尺寸显示。我缺少什么？

I've set up an example in codepen, which works great in Chrome and Safari, but not Firefox, where the image shows at full size. What am I missing?

http://cdpn.io/sHJhl

推荐答案

.photo-bkg code> height set：

.photo-bkg also needs its height set:

.photo-bkg { height: 100%; }

这是你的笔的工作叉。

这篇关于垂直响应图像（max-height）在Firefox中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！