JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container-fluid">
<div class="row">
  <div class="col-sm-6 product-box">
        <div class="col-md-12 background-contain">
      <p class="blue-title">Product Title 1</p>
      Staring at $500
      <br> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      <br>
      <div class="img-contain">
        <img src="materials/images/cereal_b.jpg" class="img-responsive" alt="cereal" />
      </div>
      <a class="bottom-link">Learn More</a>
    </div>
   </div>
   <div class="col-sm-6 product-box">
       <div class="col-md-12 background-contain">
      <p class="blue-title">Product Title 2</p>
      Staring at 1900
      <br/> Donec ornare magna sit amet erat molestie sollicitudin ac vitae lectus.
      <img src="materials/images/flower_b.jpg" class="img-responsive" alt="cereal" />
      <a class="bottom-link">Learn More</a>
    </div>
   </div>

</div>

CSS

.product-box
{
  border: 1px solid black;
}