那是因为你在footer
上设置了position:absolute
.有更简单的方法来固定底部的页脚.假设您的项目 struct 是这样的,请注意.app
中有三个直接子级:
<html>
<body>
<div id= "root">
<div class= "app">
<Header></Header>
<Content></Content>
<Footer></Footer>
</div>
</div>
</body>
</html>
您只需要:
.app {
min-height: 100vh;
display: grid;
grid-template-rows: auto 1fr auto;
/* gap: 3rem; */
}