JSFiddle - React, Tailwind, and code Playground

HTML

<div id="frame">
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
<div class="circle">dflgjddsfsdf</div>
</div>

CSS

#frame{
	width:80%;
}

.circle{
	background: red;
    display:inline-block;
	vertical-align: top;
	cursor: pointer;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding:5px;
	margin:0px 5px 10px 5px;
}

.circle:hover{
    box-shadow : 0 0 0 2px #000;
}