我想将页脚的元素居中

Question

我有一个包含 3 个元素的页脚。

© 2020，混音圣经（文本）
¿Quiénes somos？（文字）
Instagram 徽标 (png) 和 Facebook 徽标 (png)

问题是“1)”占的space比“3)”长。我希望“2)”完全居中，而不仅仅是相对居中于“1)”和“3)”之间的 space

这是我试过的：

<footer>
        <hr>
        <div class="footer_container">
            <p>© 2020, The Mixdown Bible</p>
            <p>¿Quiénes somos?</p>
            <div class="redes_container">
                <a href="/"><img src="imagenes/redes/instagram.png"></a>
                <a href="/"><img src="imagenes/redes/facebook.png"></a>
            </div>
        </div>
    </footer>

*
{box-sizing: border-box;
margin: 0;
padding: 0;}

footer
{margin-top: 60px;
margin-bottom: 40px;}

hr
{background-color: #6A6A6A;
height: 1px;}

.footer_container
{margin-left: 22%;
margin-right: 22%;
margin-top: 40px;
display: flex;
justify-content: space-between;
align-items: center;}

footer p
{font-family: "Poppins";
font-weight: 500;
font-size: 14px;
color: #6A6A6A;}

.redes_container
{display: inline-flex;}

.redes_container img
{width: 50%;}

Answer 1

我建议使用 css 网格而不是 flexbox .footer-container { 显示：网格；网格模板列：1fr 1fr 1fr } 这样 3 个 div 将采用相同的 space

我想将页脚的元素居中

I want to center the elements of a footer

html

css

footer