无法将页脚固定到底部

【问题标题】：unable to fix the footer to bottom无法将页脚固定到底部
【发布时间】：2020-07-12 17:40:06
【问题描述】：

很抱歉提出这个问题。我一直在搜索过去几个小时，但找不到任何帮助。

即使页面没有内容并且当有内容必须内容时也修复页脚底部，它应该在内容的末尾我尝试了很多方法，但没有一个对我有用我的

`<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>`

【问题讨论】：

您在示例中使用的类的 css 规则是什么？
像那些 css 属性是直接来自引导程序的

标签： java html css jsp

【解决方案1】：

您需要的是根据视口高度设置页面的最小高度，并将页脚保持在页面底部。

* {
    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>

【讨论】：

我忘记了一个 css 规则（我的错误）“位置：相对”