Question

I am using materializecss (angular-materialize) and I have many pages where my footer isn't at the bottom. In the website they say that we have to follow the html structure below and to add some css code :

<html>
    <head>
    </head>
    <body>
        <header>
        </header>
        <main>
        </main>
        <footer>
        </footer>
    </body>
</html>

CSS code added from the website :

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
  }

  main {
    flex: 1 0 auto;
  }

Even if I follow the steps, my footer doesn't want to go down.

If someone could help :)

Answer 1

footer{
   position: static;
   bottom: 0;
}

Answer 2

通常当我的页脚没有粘到底部时，我会创建边距为底部的负像素，然后将最接近元素的边距底部增加到页脚。通过边缘徘徊通常可以解决我的问题，希望有所帮助！

materializecss footer bottom

2 个答案: