JSFiddle - React, Tailwind, and code Playground

HTML

<body>


  <div class="row_short">
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
</div>


<div class="row_tall">
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
		<div class="square"></div>
		<div class="vbar"></div>
         <div class="square"></div>
		<div class="vbar"></div>


</div>



	<div class="row_short">
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div class="hbar"></div>
		<div class="dot"></div>
		<div...

CSS

body {
	
	margin: 0px;
	padding: 0px;
}


table {
    
    margin: 0px;
    padding: 0px;
}

.dot{

height:5px;
width:5px;
background-color:black;
display: inline-block;


}


.vbar {
	
	height:30px;
width:5px;
background-color: #CCCCCC;
display: inline-block;



}

.vbar:hover {
background-color:purple;

}


.hbar {
	height:5px;
width:30px;
background-color: #CCCCCC;
display: inline-block;


}

.hbar:hover {
background-color:purple;

}



.square {
	height:30px;
width:30px;
background-color: #ff88cc;
display: inline-block;

	
	
}

.row_short{
    display: inline-block;
	position:relative;

}

.row_tall{
	display: block;
	position:relative;
}