JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<body>
  <div class="" >
      <div class="div-table">
        <div class="div-table-row">
          <div class="box">
               Sample bit of text                         
          </div>    
          <div class="result-details title1"> <!-- title1 -->
              <div class="header-light title">
                <a id="X" href="http://www.google.com"> Like Text the quick brown fox jumped over the flat cat with the aplomb of a fit ferile dog like animal Lets add anothjer line and see if the box expands</a>                   
                </div>      
                Description text this is lots of very very very interesting text text
            </div>
        </div>  
        
        <div class="div-table-row">
            <div class="box">
               Sample bit of text                         
            </div>    
            <div class="result-details"> <!-- title1 -->
              <div class="header-light">
                <a id="X" href="http://www.google.com"> A short title</a>           
              </div>      
            </div>
          </div>

      <div class="div-table-row">
            <div class="box">
               Sample bit of text  which may be 2 lines long                        
            </div>    
            <div class="result-details"> <!-- title1 -->
              <div class="header-light">
                <a id="X" href="http://www.google.com"> Little link</a>                           </div>
              Description text this is lots of very very very interesting text text which in this case is going to be at least 2 lines long and maybe three lines long depending on the screen size
            </div>
      </div>
    </div>
  </div>
</body>

CSS

.div-table {
  display: table;         
  border-spacing: 0px 5px; 
}

.div-table-row {
  display: table-row;
 }

.box {
	display:table-cell;
  width: 15%;
  text-align: center;
  vertical-align: middle;
  padding: 2em 0;
  color: white;
  background-color: #333333;
  -webkit-border-radius: 4px !important;
  -moz-border-radius: 4px !important;
  border-radius: 4px !important;
}

.header-light {
    font-weight: normal;
    vertical-align: middle;
    line-height: 1em;
    font-size: 1.8em;
}

.result-details {
        vertical-align: middle;
        display:table-cell;
        width:60%;
}