JSFiddle - React, Tailwind, and code Playground

by SchmalzyB

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css">
<div class="content_wrapper_2">
  <div class="row">
    <div class="span6">
      <div class="row">
        <div class="span3 box1">
          <h4 class="padding">Products</h4>
        </div>

        <div class="span3 box2">
          <h4 class="padding">Mould labelling</h4>
        </div>
        <div class="span3 box5">
          <h4 class="padding">Services</h4>
        </div>

        <div class="span3 box6">
          <h4 class="padding">About us</h4>
        </div>
      </div>
    </div>
    <div class="span6">
      <div class="row">
        <div class="span3 box3">
          <h4 class="padding">Let's talk</h4>
        </div>

        <div class="span3 box4">
          <h4 class="padding">Get a quote</h4>
        </div>
      </div>
      <!-- end row -->

      <div class="row">
        <div class="span3 box7">
          <h4 class="padding">Get samples</h4>
        </div>

        <div class="span3 box8">
          <h4 class="padding">Client login</h4>
        </div>
      </div>
    </div>
  </div>

CSS

.box1 {
  background-color: yellow;
  height: 50px
}

.box2 {
  background-color: yellow;
  height: 50px
}

.box3 {
  background-color: pink;
  height: 50px
}

.box4 {
  background-color: pink;
  height: 50px
}

.box5 {
  background-color: yellow;
  height: 50px
}

.box6 {
  background-color: yellow;
  height: 50px
}

.box7 {
  background-color: pink;
  height: 50px
}

.box8 {
  background-color: pink;
  height: 50px
}