How to align img to the center of the block?

Question

css

You need to align the image to the center of the block. How to do it?

<ul>
        <li class="manufacturer">
          <a href="#">
            <img src="image/bosch.png" alt="Bosch" width="126" height="37">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/makita.png" alt="Makita" width="123" height="40">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/dewalt.png" alt="Dewalt" width="146" height="44">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/interskol.png" alt="Интерскол" width="200" height="76">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/hitachi.png" alt="Hitachi" width="169" height="31">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/lg.png" alt="LG" width="121" height="73">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/aeg.png" alt="AEG" width="151" height="98">
          </a>
        </li>
        <li class="manufacturer">
          <a href="#">
            <img src="image/metado.png" alt="metado" width="206" height="73">
          </a>
        </li>
      </ul>

ul {
  list-style-type: none;
  display: grid;
  grid-template-columns: 220px 220px 220px 220px;
  grid-template-rows: 145px 145px;
  gap: 20px;
}

Answer 1

li.manufacturer {
  display: flex;
  justify-content: center;
  align-items: center;
}