<div class="carousel">
  <a href="#">
    <img src="https://picsum.photos/300/100" alt="">
    <h3>Heading</h3>
    <span>Lorem ipsum dolor sit amet consectetur</span>
  </a>
  <a href="#">
    <img src="https://picsum.photos/300/100" alt="">
    <h3>Heading</h3>
    <span>Lorem ipsum dolor sit amet consectetur</span>
  </a>
  <a href="#">
    <img src="https://picsum.photos/300/100" alt="">
    <h3>Heading</h3>
    <span>Lorem ipsum dolor sit amet consectetur</span>
  </a>
  <a href="#">
    <img src="https://picsum.photos/300/100" alt="">
    <h3>Heading</h3>
    <span>Lorem ipsum dolor sit amet consectetur</span>
  </a>
</div>

.carousel {
  display: flex;
  gap: 20px; 
  overflow-x: hidden;
}

a {
  min-inline-size: 220px;
}

img {
  max-inline-size: 100%;
}