我有多个div元素，我想要做的只是将height和width设置为100%，以便每个元素占用一个整数页。
这在HTML 4.01 Strict和CSS 2.1中证明非常困难，但没有将它们定位为absolute或fixed，但我想避免这样做。
我尝试了每一个display值。
我已经尝试了每个position值。他们都没有做到这一点。
我已尝试设置html { display: table; }，body { display: table-row; }和.div { display: table-cell; }，但这不起作用。
除非position每个div为absolute或fixed，否则似乎没有任何效果，但我真的想避免这种情况，并且更愿意{{} 1}}每个position为div，因为我将通过JS注入其他relative元素，我不想跟踪那里有多少div个元素是为了相应地定位它们。
divhtml, body {
width : 100%;
height : 100%;
margin : 0;
padding : 0;
}
html {
display : table;
}
body {
display : table-row;
}
.page {
width : 100%;
height : 100%;
position : relative;
display : table-cell;
}
#red { background : red; }
#orange { background : orange; }
#yellow { background : yellow; }
#green { background : green; }
#blue { background : blue; }
#indigo { background : indigo; }
#violet { background : violet; }
我已尝试将<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link href="test.css" rel="stylesheet">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>test</title>
</head>
<body>
<div class="page" id="red">red</div>
<div class="page" id="orange">orange</div>
<div class="page" id="yellow">yellow</div>
<div class="page" id="green">green</div>
<div class="page" id="blue">blue</div>
<div class="page" id="indigo">indigo</div>
<div class="page" id="violet">violet</div>
</body>
</html>
width设置为html, body，但这也不起作用。
非常感谢任何帮助。
答案 0 :(得分：2)
更改
.page {
width : 100%;
height : 100%;
position : relative;
display : table-cell;
}
以
.page {
width: 100%;
height: 100%;
position: relative;
}
答案 1 :(得分：1)
要达到预期效果，请尝试以下选项
.page {
width : 100%;
height : 100%;
position : relative;
display : table;
}