JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.ampproject.org/v0.js"></script>
<script src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script>
<h2>AMP carousel</h2>
<amp-carousel width=500 height=300>
  <amp-img src="http://placehold.it/200x600" width=200 height=600></amp-img>
  <amp-img src="http://placehold.it/700x550" width=700 height=550></amp-img>
  <amp-img src="http://placehold.it/340x410" width=340 height=410></amp-img>
</amp-carousel>

<h2>what I want:</h2>
<div class="img-container">
  <img src="http://placehold.it/200x600" width=200 height=600 />
  <img src="http://placehold.it/700x550" width=700 height=550 />
  <img src="http://placehold.it/340x410" width=340 height=410 />
</div>

CSS

.img-container {
  
  width: 500px;
  height: 300px;
  white-space: nowrap;
  overflow: hidden;
}
.img-container img {
  display: inline-block;
  max-height: 300px;
  width: auto;
}