简体   繁体   English

无法将页脚固定到底部

[英]unable to fix the footer to bottom

Sorry for asking this question.很抱歉问这个问题。 I was searching for the past few hours but could not find any help.我一直在寻找过去几个小时,但找不到任何帮助。

fixing footer bottom even when the page doesn't have content and when there is content has to content it should be at the end of content I tried many ways but none worked for me my即使页面没有内容并且当有内容必须内容时也可以修复页脚底部,它应该在内容的末尾我尝试了很多方法,但没有一个对我有用

`<footer class="c-primary ">(tried but getting footer over content static-bottom,fixed-bottom)

  <div class="footer-copyright text-center py-3">&copy; Beginners Insight  2020
    <a href="http://localhost:8080/Beginners_Insight/index.jsp">BeginnersInsight.com</a><br>
    MADE WITH &hearts; BY Team ITF
  </div>


</footer>`

What you want is set the min height of your page according to the viewport height and keep the footer at the bottom of your page.您想要的是根据视口高度设置页面的最小高度,并将页脚保持在页面底部。

 * { box-sizing: border-box; margin: 0; } header { background-color: blue; }.content { position: relative; min-height: 100vh; background-color: blueviolet; } footer { background-color: green; position: absolute; bottom: 0; width: 100%;}
 <.DOCTYPE html> <head> <title>Footer bottom test</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="content"> <header>my header</header> <main> </main> <footer> <div> Beginners Insight 2020 <a href="">BeginnersInsight;com</a> MADE WITH &hearts; BY Team ITF </div> </footer> </div> </body> </html>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM