我无法使页脚停留在页面底部。我不希望在滚动时（仅当用户到达页面底部时）将其修复。我认为这与我的网格有关。
<body>
<ul>
<li>Home</li>
<li>About</li>
<li>The Developer</li>
<li>Contact</li>
</ul>
<h1>Welcome to the City of Melbourne!</h1>
<h2 style="margin-bottom: 50px;">Where would you like to go?</h2>
<div class="col_contain">
<a href="frederation/frederationsquare.html"><div class="container">
<img src="http://rmitcatalyst.com/wp-content/uploads/2013/03/Fed-Square.jpg" alt="Frederation Square" class="image">
<div class="middle">
<div class="text">Federation Square</div>
</div>
</div></a>
<a href="chinatown/chinatown.html"><div class="container">
<img src="http://www.whitehat.com.au/images/melbourne/CTown.jpg" alt="Chinatown" class="image">
<div class="middle">
<div class="text">Chinatown</div>
</div>
</div></a>
<a href="library/library.html"><div class="container">
<img src="https://www.slv.vic.gov.au/sites/default/files/styles/feature_image/public/strategic-plan-hero.jpg?itok=CCmv7jIG" alt="State Library" class="image">
<div class="middle">
<div class="text">State Library of Victoria</div>
</div>
</div></a>
<a href=""><div class="container">
<img src="http://www.mymarketsvic.com.au/directory/files/logo/58.jpg" alt="South Melbourne Market" class="image">
<div class="middle">
<div class="text">South Melbourne Market</div>
</div>
</div></a>
<a href="shrine/shrine.html"><div class="container">
<img src="https://thumbs.dreamstime.com/b/shrine-remembrance-melbourne-australia-july-bright-flowers-below-victoria-memorial-to-58139919.jpg" alt="Shrine of Remembrance" class="image">
<div class="middle">
<div class="text">Shrine of Remembrance</div>
</div>
</div></a>
<a href=""><div class="container">
<img src="https://media-cdn.tripadvisor.com/media/photo-s/12/35/7f/fd/ngv-triennial-skull-room.jpg" alt="NGV" class="image">
<div class="middle">
<div class="text">National Gallery of Victoria</div>
</div>
</div></a>
</div>
</body>
<footer style="background-color: white;">
Created by Carisa Atmarini
</footer>
我尝试过这样做，但是它变得定位在身体上方，而不是在底部。如果有人有线索，请告诉我。
这是我的整页Codepen链接： https://codepen.io/codecarisa/pen/pZoXYW
答案 0 :(得分：0)
我认为主要问题是.col_contain：取消高度。
还请移除页脚上的position: absolute，并确保页脚位于主体内部。
并更改主体上的填充：
body { padding-bottom: 0; }