JSFiddle - React, Tailwind, and code Playground

by Simon Price

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<table class="table table-bordered">
  <thead>
    <tr>
      <th>
        <div class="col-xs-11 col-sm-11 col-md-11 col-lg-11">
          <div class="col-xs-10 col-sm-10 col-md-12 col-lg-12">Order Number</div>
        </div>
        <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
          <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 pull-right">
              <a id="HeadRepeater_LinkButton1" href="#"><i class="fa fa-sort-asc pull-right"></i></a>
            </div>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12  pull-right">
              <a id="HeadRepeater_LinkButton11" href="#"><i class="fa fa-sort-desc pull-right"></i></a>
            </div>
          </div>
        </div>
      </th>
      <th>
        <div class="col-xs-11 col-sm-11 col-md-11 col-lg-11">
          <div class="col-xs-10 col-sm-10 col-md-12 col-lg-12">Number</div>
        </div>
        <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
          <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 pull-right">
              <a id="HeadRepeater_LinkButton1" href="#"><i class="fa fa-sort-asc pull-right"></i></a>
            </div>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12  pull-right">
              <a id="HeadRepeater_LinkButton11" href="#"><i class="fa fa-sort-desc pull-right"></i></a>
            </div>
          </div>
        </div>
      </th>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>