小编mad*_*s30的帖子

我对此非常陌生，并使用 HTML 和 CSS 构建我的第一个网页。我一直在使用 Bootstrap 4.5 框架。我试图让带有社交媒体图标的页脚保持在底部（文本下方）并保持居中。我希望它即使超过视口也保持在底部。

我尝试过：使用flexbox和justify-content-center，尝试在CSS本身中使用文本对齐中心，还尝试添加一个id以使其更具体，但不确定我对这种情况下的特殊性的理解是否正确。希望得到一些建议，代码如下。

HTML：

<div class="footer">
    <span id="bottom"> 
        <hr>
        <p>
            <a href="#"><i class="fab fa-twitter"></i></a>
            <a href="#"><i class="fab fa-instagram"></i></a>
            <a href="#"><i class="fab fa-facebook"></i></a>
       </p>
    </span>
</div>

CSS：

i {
    margin: 5px;
    color: #FFE10E;
}

.footer {
    position: absolute;
    bottom: 0;
    text-align: center;
}

#bottom {
    text-align: center;
}