JSFiddle - React, Tailwind, and code Playground

HTML

<div>
<h3>
Só Horizontalmente
</h3>
<div class="horizontal">
<img src="https://static.pexels.com/photos/248797/pexels-photo-248797.jpeg">
<img src="https://static.pexels.com/photos/248797/pexels-photo-248797.jpeg">
</div>
Ambos Centrados (TOP E LEFT)
<div class="ambos">
<img src="https://static.pexels.com/photos/248797/pexels-photo-248797.jpeg">
<img src="https://static.pexels.com/photos/248797/pexels-photo-248797.jpeg">
<img src="https://static.pexels.com/photos/248797/pexels-photo-248797.jpeg">
</div>

CSS

.horizontal{
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  border:1px solid black;
  padding:10px;
}
.horizontal > img{
  width:100px;
}

.ambos{
  border:1px solid black;
  position:absolute;
  left:50%;
  padding:10px;
  top:50%;
  transform: translate(-50%,-50%);
}
.ambos > img{
  width:100px;
}