calc（）无法在Firefox中运行

Question

我正在尝试使用calc（）来使我的页面内容完美地适合页面。我有一个高度为52px的标题。我正在尝试将100％的容器制作成50％的页面 - 它完全适合页面，但是因为它在Chrome，Edge和Internet Explorer中可以使用，所以它不适用于Firefox。

铬： Chrome result

火狐： Firefox result

div#container {

	width: 20%;

	height: 100%;

	height: calc(100% - 52px);

	height: -moz-calc(100% - 52px);

	height: -webkit-calc(100% - 52px);

	float: left;

}

<div id="container"></div>

Answer 1

原来我需要将身体的高度设置为100％才能生效。我以为我会让其他用户知道，以防他们遇到同样的问题。

＆＃13;

＆＃13;

html,
body {
	height: 100%;
}

＆＃13;

＆＃13;

＆＃13;