JSFiddle - React, Tailwind, and code Playground
HTML
<div id='img-container'>
<p class='nav'><a id='prev' href='#'>Prev</a> | <a id='next' href='#'>Next</a>
<span id='num'></span></p><div id='s1' class='pics'>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew16.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew20.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew17.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew02.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew23.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew14.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_kew01.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_botanico12-edit.jpg' class='img-bot' /><p> </p></div>
<div><img src='http://joaopaulocarvalho.com/files/gimgs/17_botanico13-edit.jpg' class='img-bot' /><p> </p></div>
</div>
</div>
CSS
#img-container {
margin:0;
padding:0;
width: 700px;
height: 700px;
margin-left: auto;
margin-right: auto;
margin-top:-150px;
padding-bottom: 0px;
padding-left:300px;
position:relative;
}