JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slider">
    <img src="http://placehold.it/350x150" alt="slider" />
    <img src="http://placehold.it/350x150" alt="slider" />
    <img src="http://placehold.it/350x150" alt="slider" />
    <img src="http://placehold.it/350x150" alt="slider" />
</div>

CSS

.slider{
    width; 100%
    height: auto;
}

.slider img{
    width: 24%;
}
 
@media (max-width: 992px) {
    .slider img{
        width: 48%;
    }
}

@media (max-width: 768px) {
    .slider img{
        width: 48%;
    }
}

@media (max-width: 480px) {
    .slider img{
        width: 90%;
        margin; 0 auto;
    }
}