-moz-可用高度在 Firefox 中不起作用

Question

我使用 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;
}

Answer 1

对于 firefox，您必须为正文和 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;
}

这对我有用。希望对您有所帮助。

-moz-可用高度在 Firefox 中不起作用

-moz-available height not working in firefox

css

firefox

mozilla