JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container-fluid">
<br/>
<div class="row">
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/laf.svg" alt="Advertisements">Advertisements</h2>
<p class="texthome">View and manage ads</p>
<p><a class="btn btn-default" href="#">Advertisements »</a></p>
</div>
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/user.png" alt="Users">Users</h2>
<p class="texthome">View and manage your users</p>
<p><a class="btn btn-default" href="#">Manage Users »</a></p>
</div>
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/stats.png" alt="Statistics">Statistics</h2>
<p class="texthome">View user logins and data usage</p>
<p><a class="btn btn-default" href="#">View Stats »</a></p>
</div>
</div>
<hr>
<div class="row">
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/marketing.png" alt="Logout"> Promotions</h2>
<p class="texthome">Design and Send Promotional Emails and SMS</p>
<p><a class="btn btn-default" href="#">Marketing »</a></p>
</div>
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/policy.png" alt="Policy">Policy</h2>
<p class="texthome">Create policies for managing user restrictions</p>
<p><a class="btn btn-default" href="#">Configure Policies »</a></p>
</div>
<div class="col-lg-4 centeralign">
<h2 class="texthome"><img src="/images/reception.png" alt="Reception">Reception</h2>
<p class="texthome"> Visit Reception features</p>
<p><a class="btn btn-default"...
CSS
img {vertical-align:middle}