我提前道歉，因为这可能是一个重新发布，但是我已经在许多线程中尝试了解决方案，但没有找到解决我的问题的方法。
您可以在以下链接中查看我的文件。
https://www.dropbox.com/sh/ovom8y01p16iqri/AADtBbLW5aYmANsy7R_3x_Vga
问题是，当我重新调整网页大小时，网页变长了，但我的页脚仍保留在原位。 我还添加了两个媒体查询，我也需要将页脚留在底部。
如果你们能提供任何帮助，我将不胜感激。
谢谢 阿米特
编辑:
谢谢，我真的很感激所有的帮助。尽管我无法继续前进。
每当我尝试将解决方案应用到我的页面时，页脚要么转到页面顶部，要么卡在中间。
我想我可能做错了什么。我所有的文件都在这个保管箱里。
https://www.dropbox.com/sh/ovom8y01p16iqri/AADtBbLW5aYmANsy7R_3x_Vga
再次感谢
阿米特
最佳答案
您可以尝试将此作为引用。
HTML
<html lang="en">
<body>
<div class="pageOuter">
<div class="header"> Lorem ipsum </div>
<div class="midContent">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. <br/><a href="#" class="addMore" >Add more content</a><br/><a href="#" class="delete" >Delete Content</a></p>
</div>
<div class="footer"> Lorem ipsum </div>
</div>
</body>
</html>
CSS
body {
margin: 0;
}
body, html {
height: 100%;
min-height: 100%;
}
.pageOuter {
position: relative;
min-height: 100%;
}
.footer,
.header {
padding: 10px;
background: #ccc ;
}
.midContent {
padding: 10px 10px 70px 10px;
}
.footer {
position: absolute;
left: 0;
right: 0;
bottom: 0;
}
关于html - 调整页面大小时需要页脚保持在内容下方，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24144209/