Я хочу центрировать элементы нижнего колонтитула - PullRequest
Новая
       3

Я хочу центрировать элементы нижнего колонтитула

0 голосов
/ 01 марта 2020

У меня есть нижний колонтитул с 3 элементами.

  1. © 2020, The Mixdown Bible (текст)
  2. ¿Quiénes somos? (текст)
  3. Instagram lo go (png) и Facebook lo go (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%;}

1 Ответ

0 голосов
/ 01 марта 2020

Я бы предложил использовать сетку css вместо flexbox .footer-container {display: grid; столбцы шаблона сетки: 1fr 1fr 1fr} Таким образом, 3 элемента div заняли бы одинаковое пространство

...