JSFiddle - React, Tailwind, and code Playground

HTML

<div id="centerArrows">
        <div class="rowdiv">
            <pre><img src="http://i.imgur.com/oGvNc0L.png" /><img src="http://i.imgur.com/oGvNc0L.png" /></pre>
        </div>
        <div class="rowdiv">
            <pre><img src="http://i.imgur.com/oGvNc0L.png" /><img src="http://i.imgur.com/oGvNc0L.png" /></pre>
        </div>
</div>

CSS

html , body , #centerArrows{
    display:table;
    width:100%;
    height:100%;
}
#centerArrows{
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}
.rowdiv{
    width:100%;
}
.rowdiv img{
    width:80px;
    max-width:50%;
}

JavaScript

$(window).resize(function(){
    if($(window).width()<=160)
    {
        $('.rowdiv').find('img').css({'width':'100%'});
    }
    else{
        $('.rowdiv').find('img').css({'width':'80px'});        
    }
});