我在我的网页上使用了 Materialize,由于某些原因,即使我为此使用了 Materialize 自己推荐的 CSS,页脚也不会留在底部。我错过了什么吗?
这是 CSS:
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto;
}
这是页脚的 HTML:
<footer class="page-footer green lighten-1">
<div class="container">
<div class="wrapper">
<!-- Icon Section -->
<div class="row">
<div class="col s12 m4">
<div class="icon-block">
<h4 class="green-text" id="mailIcon"><i class="material-icons">mail</i></h4>
<p class="white-text">info@storytourist.com</p>
</div>
</div>
<div class="col s12 m4">
<div class="icon-block">
<h4 class="green-text" id="adressIcon"><i class="material-icons">map</i></h4>
<p>Veldrom AB, Anckargripsgatan 3, 211 19 Malmö, Sweden</p>
</div>
</div>
<div class="col s12 m4">
<div class="icon-block">
<h4 class="green-text" id="phoneIcon"><i class="material-icons">phone</i></h4>
<p class="white-text">+46 720 427 346</p>
</div>
</div>
</div>
</footer>
最佳答案
问题已解决。
没有使用主标签。
<body>
<main> //added
<div class="container">
</div>
</main>
<footer> this is my footer </footer>
<body>
关于html - 实现页脚不会留在底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50209365/