JSFiddle - React, Tailwind, and code Playground

by petroveg

HTML

<div class="d1">
	<div class="d2">
		<div class="d3">1</div>
		<div class="d3">2</div>
		<div class="d3">3</div>
		<div class="d3">4</div>
		<div class="d3">5</div>
		<div class="d3">6</div>
		<div class="d3">7</div>
		<div class="d3">8</div>
		<div class="d3">9</div>
		<div class="d3">10</div>
		<div class="d3">11</div>
		<div class="d3">12</div>
		<div class="d3">13</div>
		<div class="d3">14</div>
	</div>
</div>

CSS

@-webkit-keyframes move{
	0%{left:-900px;}
	100%{left:0;}
}
@keyframes move{
	0%{left:-900px;}
	100%{left:0;}
}
.d1{
	overflow:hidden;
	background:#f0f0f0;
}
.d2{
	position:relative;
	font-size:0;
	line-height:0;
	white-space:nowrap;
	-webkit-animation:move 2s linear;
	-webkit-animation-iteration-count:infinite;
	animation:move 2s linear;
	animation-iteration-count:infinite;
}
.d3{
	width:140px;
	height:100px;
	background:#369;
	display:inline-block;
	margin:10px 0;
}
.d3 + .d3{
	margin-left:10px;
}