JSFiddle - React, Tailwind, and code Playground

by Евгений

HTML

<div class="outer">
    <div class="inner">
	<ul>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
        <li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
	</ul>
    </div>
</div>

CSS

.outer{
	border: 1px solid red;
	padding: 10px 0;
    overflow: hidden;
    text-align: center;
	}
.inner{
    text-align: center;
    margin: 0 -1000%;
    overflow: hidden;
}
ul{
	white-space: nowrap;
	text-align: center;
	padding: 0;
    display: table;
    margin: 0 auto;
}
li{
	display: table-cell;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	border-radius: 100%;
	background: blue;
}