JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<div id="panel-1" class="panel panel-default">
  <div class="panel-heading clearfix">
     <div class="row">
          <div class="col-xs-2 cell">
                    <button type="button" class="btn btn-default some-button">
        button!
      </button>
          </div>
          <div class="col-xs-8 cell">
                  <h4 class="panel-title pull-left heading">
      <a>
        Short
      </a>
    </h4>
          </div>
          <div class="col-xs-2 cell" >
                  <div class="btn-group">
      <button type="button" class="btn btn-default">a</button>
      <button type="button" class="btn btn-default">b</button>
      <button type="button" class="btn btn-default">c</button>
    </div>
          </div>
  </div>
</div>

<div id="panel-2" class="panel panel-default">
  <div class="panel-heading clearfix">
      <div class="row">
          <div class="col-xs-2 cell">
                    <button type="button" class="btn btn-default some-button">
        button!
      </button>
          </div>
          <div class="col-xs-8 cell">
                  <h4 class="panel-title pull-left heading">
      <a>
        Some string that's really longish and stuff hehe right? (looooong long long)
      </a>
    </h4>
          </div>
          <div class="col-xs-2 cell">
                  <div class="btn-group">
      <button type="button" class="btn btn-default">a</button>
      <button type="button" class="btn btn-default">b</button>
      <button type="button" class="btn btn-default">c</button>
    </div>
          </div>
      </div>




  </div>
</div>

CSS

.heading {
  font-size: 20px;
  padding-left: 10px;
}
.cell{display:table-cell; vertical-align:middle;float:none;}