⚡ Quick Fix (TL;DR)

The Culprit: Image elements are block-level by default, so with no layout instruction they simply stack one on top of the other.

The Fix: Wrap the images in a flex container so they line up horizontally, with controlled spacing between them. Depends on the surrounding markup already grouping the images inside a shared wrapper.

.image-row {
  display: flex;
  gap: 16px;
}
.image-row img {
  width: 50%;
  height: auto;
}