JSFiddle - React, Tailwind, and code Playground
by Hernani Mattos
HTML
<div class="cont">
<span class="btn-left"></span>
<span class="mask">
<div>1</div>
<div>2</div>
<div>3</div>
</span>
<span class="btn-right"></span>
</div>
CSS
.cont{
width:500px;
height:200px;
border:solid 1px #ccc;
overflow:hidden;
position:relative;
}
.btn-right,.btn-left{
display:block;
width:20px;
height:20px;
background-color:#ccc;
position:absolute;
}
.btn-right{
right:10px;
top:10px;
background-color:red;
}
.mask{
margin-left:30px;
display:block;
width:1000px;
height:220px;
border:solid blue 1px;
}
.cont div{
width:140px;
height:190px;
float:left;
border:solid 1px red;
float:left;
}