我正在尝试将div附加到页面底部。此页面不可滚动，但我无法按像素设置顶部，因为它需要响应屏幕尺寸。我只想要页面底部的一个div，该div占据水平空间的100％和垂直空间的20％。
我尝试过的：
min-height: 100%这是我的代码：
<html>
<head>
<title>Forget It</title>
<link rel="stylesheet" href="../static/styles.css">
</head>
<body>
<div class='parent'>
<div class='ground'></div>
</div>
</body>
</html>
html {
height: 100%;
}
body {
height: 100%;
margin: 0;
padding: 0;
background-color: #96b4ff;
}
.parent {
position: relative;
min-height: 100%;
}
.ground {
position: absolute;
height: 20%;
bottom: 0;
background-color: #2cb84b;
}
有什么想法吗？谢谢！
只需将width: 100%;应用于.ground，以使div占据全角。
html {
height: 100%;
}
body {
height: 100%;
margin: 0;
padding: 0;
background-color: #96b4ff;
}
.parent {
position: relative;
min-height: 100%;
}
.ground {
position: absolute;
height: 20%;
width: 100%;
bottom: 0;
background-color: #2cb84b;
}<div class='parent'>
<div class='ground'>footer</div>
</div>