JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<div class="col-xl-4 col-lg-3 col-md-4 col-sm-6 col-xs-12 auto">
  <div class="widget">
    <div class="name">
      Block name
    </div>
    <div class="description">
      Some description goes here
    </div>
  </div>
</div>

<div class="col-xl-4 col-lg-3 col-md-4 col-sm-6 col-xs-12 auto">
  <div class="widget">
    <div class="name">
      Block name
    </div>
    <div class="description">
      Some very long description goes here
    </div>
  </div>
</div>

<div class="col-xl-4 col-lg-3 col-md-4 col-sm-6 col-xs-12 auto">
  <div class="widget">
    <div class="name">
      Block name
    </div>
    <div class="description">
      Some description goes here
    </div>
  </div>
</div>

CSS

.widget {
  width: 100%;
  margin: 10px;
  padding: 10px;
  background-color: white;
  //height: auto;
  border: 1px silver solid;
  font-size: 18px;
}

.name {
  font-weight: bold;
  height: 40px;
  color: #082654;
}

.description {
  color: #4AB6E1;
}

JavaScript

var maxheight = 0;

$('div div.widget').each(function () {
    maxheight = ($(this).height() > maxheight ? $(this).height() : maxheight); 
});

$('div div.widget').height(maxheight);