how to decrease the height of the footer while keeping the text inside centered

Question

This is my css code I tried using padding, margin and a few other things to decrease the size height but it did not work but all of them would either move the footer out of the bottom completely or leave the text uncentered.

footer {
  background: #fce138;
  width: 100%;
  padding: -100px 0;
}

footer h2 {
  display: inline;
  color: #024e76;
  font-size: 30px;
  margin: 0;
}

footer div {
  float: right;
  line-height: 1.5;
  text-align: right;
}

footer a {
  color: #024e76;
}

This is my HTML code

<footer>
    <section>
    <h2> ❤️ Made with love by Run Buddy</h2>
    <div>
      <a href="#">Read Our Privacy Policy</a><br/>
      &copy; 2019 Run Buddy, Inc.
    </div>
  </section>
</footer>

footer image

Answer 1

HTML:

<footer>
<h2> ❤️ Made with love by Run Buddy</h2>
<div>
  <a href="#">Read Our Privacy Policy</a><br/>
  &copy; 2019 Run Buddy, Inc.
</div>

CSS:

footer {
  background: #fce138;
  width: 100%;
  height:200px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

footer h2 {
  display: inline;
  color: #024e76;
  font-size: 30px;
  margin: 0;
}

footer div {
  float: right;
  line-height: 1.5;
  margin-right:10px;
  text-align: right;
}

footer a {
  color: #024e76;
}

You can give whatever value you want to the height value in the footer.