JSFiddle - React, Tailwind, and code Playground

by kodjoe mambi

HTML

<div class="wrap clearfix">
		<div class="box">
    <div class="box-inner"></div>
    </div>
		<div class="box">
    <div class="box-inner"></div>
    </div>
		<div class="box">
    <div class="box-inner"></div>
    </div>
		<div class="box">
    <div class="box-inner"></div>
    </div>
		<div class="box">
    <div class="box-inner"></div>
    </div>
		<div class="box">
    <div class="box-inner"></div>
    </div>
	</div>

CSS

.wrap {
	margin: 0 auto;
	width: 1024px;
	height: 800px;
	background-color: yellow;
}

.box {
	box-sizing: border-box;
	width:33.334%;
	height: 200px;
	float: left;
	padding-left: 10px;
  padding-bottom: 10px;
}
.box:first-child {
	padding-left: 0;
}

.box-inner {
	background-color: grey;
	width: 100%;
	height: 100%;
}