[FIXED] How can I vertically center an "a" in a list near an image?

Issue

How can I vertically center the text "PAYPAL" "CREDIT CARD" and "CRYPTO" near the image?

.payments-nav ol li {
  display: inline-block;
  background-color: red;
}

<div class="payments-nav">
  <ol class="payments-nav-links">
    <li class="paypal">
      <a href="paypal-shop.html"><img src="img/paypal.png" alt="paypal-img" class="paypal-img" />CREDIT CARD</a>
    </li>
    <li class="card">
      <a href="card-shop.html"><img src="img/credit-card.png" alt="creditcard-img" class="creditcard-img" />CREDIT CARD</a>
    </li>
    <li class="crypto">
      <a href="crypto-shop.html"><img src="img/crypto.png" alt="crypto-img" class="crypto-img" />CRYPTO</a>
    </li>
  </ol>
</div>

screenshot here:

Solution

CSS:

.payments-nav-links li a {display: flex; align-items: center;}

Answered By - 1058u4

Answer Checked By - Senaida (PHPFixing Volunteer)