JSFiddle - React, Tailwind, and code Playground
HTML
<!--
notice the images are 300px tall.
Even though the width of the images are affected by the flex layout, the height stays at 300px.
-->
<div class="slider">
<img src="http://www.placebacon.net/400/300" alt="Bacn">
<img src="http://www.placebacon.net/400/300" alt="Bacn">
<img src="http://www.placebacon.net/400/300" alt="Bacn">
<img src="http://www.placebacon.net/400/300" alt="Bacn">
</div>
CSS
.slider {
display: flex;
flex-direction: column;
}
.slider img {
margin: 0;
width: 100%;
}