JSFiddle - React, Tailwind, and code Playground

HTML

<section class="wrapper clearfix">
     <div class='inner-wrap'>
        <section class="col">
            <img src="http://placehold.it/200x120" alt="">
        </section>
        <section class="col">
            <img src="http://placehold.it/200x120" alt="">
        </section>
            </div>
    </section>

CSS

@media screen and (max-width: 600px) {
    .col {
        max-width: 150px;
    }
}

.inner-wrap {
    display: inline-block;
    background: grey;
}
.wrapper {
    text-align: center;
    max-width: 500px;
    margin: 0 auto;
    font-size: 0;
}

.col {
    width: 200px;
    margin-right: 100px;
    display: inline-block;
}

.col:last-child {
    margin-right: 0px;
}

img {
    max-width: 100%;
}