JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<div class="container">
  <div class="row">
      <div class="col-sm-8 col-8 black">
          <p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p><p>Bar Graph or Line Graph. </p>
      </div>
      <div class="col-sm-4 col-4 d-flex align-content-around flex-wrap ">
        <div class="red w-100">
          <p>numbers and more and so on and on and on</p>
        </div>
        <div class="purple w-100">
          <p>numbers this is the best of them all</p>
        </div>
        <div class="green w-100">
          <p>numbers</p>
        </div>
        <div class="blue w-100">
          <p class="mb-0">numbers</p>
        </div>
      </div>
  </div>
</div>

CSS

p { color: #fff; }
.black { background-color: black; }
.green { background-color: green; }
.red { background-color: red; }
.blue { background-color: blue; }
.purple { background-color: purple; }