我使用 chrome 中可用的填充,它工作得很好,但在 firefox 中不行。 这是 fiddle :fiddle 为什么它不起作用?请帮忙。
.container {
background: steelblue;
height: 100%;
height: -moz-available; /* WebKit-based browsers will ignore this. */
height: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
height: fill-available;
width: 100%;
width: -moz-available; /* WebKit-based browsers will ignore this. */
width: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
width: fill-available;
}
最佳答案
对于 firefox,您必须为 body 和 html 元素设置高度:'100%',如下所示:
html, body {
height: 100%;
}
.container {
height: 100%;
min-height: -moz-available; /* WebKit-based browsers will ignore this. */
min-height: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
min-height: fill-available;
}
这对我有用。希望对您有所帮助。
关于css - -moz-可用高度在 Firefox 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55133385/