我一直在努力让我的网站有一个边距均匀的包装器,但是底部边距总是太大。为了隔离问题,我注释掉了 html 中的所有 div 内容,并注释掉了所有与基本 div 无关的 css 选择器,但窗口 div 仍然会超出页脚。
这是 css,您会注意到某些 css 属性以 s 开头拼写错误。不用担心这些,这只是我注释掉 css 属性的一种快速方法。
.window {
width: 88%;
height: 99%;
smargin-top: 3%;
smin-height: 800px;
margin-left: 7%;
sbox-shadow: 0px 0px 10px 1px #000000;
min-width: 1110px;
background-color: #FF0000;
}
.header {
height: 15%;
width: 100%;
background-color: #DDDDDD;
padding-top: 1%;
smin-height: 100px;
}
.nav {
font-size: 20px;
spadding-top: 1%;
height: 5%;
width: 100%;
background-color: #999999;
font-family: Tahoma, Geneva, sans-serif;
smin-height: 35px;
max-height: 40px;
}
.content {
height: 60%;
width: 100%;
smin-height: 350px;
: ;
spadding-top: 3%;
background-color: #FFFFFF;
}
.footer {
font-family: Arial, Helvetica, sans-serif;
height: 5%;
width: 100%;
background-color: #DDDDDD;
smin-height: 30px;
}
这是 html,我排除了所有注释掉的内容,因此问题将与它的基本基础结构隔离。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Excercise 2 CSS</title>
</head>
<body>
<div class="window">
<div class="header">
</div>
<div class="nav">
</div>
<div class="content">
</div>
<div class="footer">
</div>
</div>
</body>
</html>