Footer - how to center a block

Question

I'm trying to create a footer like this:

but i don't know how to position the footer__inner block in the center

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.footer {
    background: url(../assets/pay_me/payme_background.jpeg)
    center center ;
    height: 350px;
}

.footer__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

<footer class="footer">
    <div class="container">
        <div class="footer__inner">
            <div class="footer__logo">
                <img src="/assets/header/logo_luna.png" alt="">
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                    sed do eiusmod <br> tempor.incididunt ut labore et dolore magna 
                    aliqua. 
                </p>
            </div>
            <div class="footer__btn">
                <a class="btn payme__btn" href="#"> Contact us </a>
            </div>
        </div>
    </div>
</footer>

Answer 1

You could use flexbox for your footer class and align items at its center:

.footer {
  background: url(../assets/pay_me/payme_background.jpeg)
  center center ;
  height: 350px;
  display: flex;
  align-items: center;
}

Answer 2

You have to define a width for footer_inner, otherwise it will have full width.

And to center that within .container, apply to it the same flex settings which you already have for .footer_inner

.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.footer {
  background: url(../assets/pay_me/payme_background.jpeg) center center;
  height: 350px;
  background: #ddd;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer__inner {
  width: 480px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

<footer class="footer">
  <div class="container">

    <div class="footer__inner">
      <div class="footer__logo">
        <img src="https://placehold.it/80x40/fa0" alt="">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod <br> tempor.incididunt ut labore et dolore magna aliqua.
        </p>
      </div>
      <div class="footer__btn">
        <a class="btn payme__btn" href="#"> Contact us </a>
      </div>
    </div>


  </div>
</footer>