我想将页脚的元素居中

Question

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

1. ©2020，混合圣经（文本）
2. ¿Quiénessomos？ （文本）
3. Instagram徽标（png）和Facebook徽标（png）

问题在于，“ 1）”所占据的空间比“ 3）”更长。我希望“ 2）”完全居中，而不仅仅是“ 1）”和“ 3）”之间的居中。

这是我尝试过的：

<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%;}

我有一个包含3个元素的页脚。 ©2020，《混合圣经》（文本） （文本）Instagram徽标（png）和Facebook徽标（png）问题是“ 1）”所占空间比“ ...

Answer 1

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