JSFiddle - React, Tailwind, and code Playground

by Zonedark

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<div class="ppp">
   <div class="ccc">

   </div>
   <div class="ccc">

   </div>
</div>
<br/>
<div class="PPP">
   <div>
      <div class="CCC">

      </div>
      <div class="CCC">

      </div>
   </div>
   <div>
      <div class="CCC">
         <div style="text-align:center">
				<h3>
				Electricité (année en cours)
				</h3>
         </div>
         <div>
            <i class="fa fa-bolt"></i>Electricité (année en cours)
         </div>

      </div>
      <div class="CCC">
         <i class="fa fa-bolt"></i>Gaz (année en cours)
      </div>
   </div>
</div>

CSS

.ppp {
   border: solid 1px black;
   display: table;
   border-spacing: 20px;
}

.ccc {
   border: solid 1px blue;
   width: 300px;
   height: 300px;
   display: table-cell;
}

.PPP {
   border: solid 2px black;
   display: table;
   border-spacing: 20px;
}

.CCC {
   border: solid 2px blue;
   width: 300px;
   height: 300px;
   display: table-cell;

}