JSFiddle - React, Tailwind, and code Playground

by robulus

HTML

<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css">
<!-- 
  Bootstrap docs: https://getbootstrap.com/docs
-->

<div class="container">
  <table class="table table-striped">
    <thead>
      <tr>
        <th scope="col">#</th>
        <th scope="col">First</th>
        <th scope="col">Last</th>
        <th scope="col">Handle</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th scope="row">1</th>
        <td>Mark</td>
        <td>Otto</td>
        <td>@mdo</td>
      </tr>
      <tr>
        <th scope="row">2</th>
        <td>
          <div>
            <Button>
              Mark
            </Button>
          </div>
        </td>
        <td>
          <div>
            <Button>
              Mark
            </Button>
          </div>
        </td>
        <td>
          <div>
            <Buttom>
              Mark
            </Buttom>
          </div>
        </td>
      </tr>
      <tr>
        <th scope="row">2</th>
        <td>
          <div>
            <Buttom>
              Mark
            </Buttom>
          </div>
        </td>
        <td>
          <div>
            <Button>
              Mark
            </Button>
          </div>
        </td>
        <td>
          <div>
            <Button class="btn btn-success">

            </Button>
          </div>
        </td>
      </tr>

    </tbody>
  </table>
</div>

CSS

td {
  padding: 0;
}

td button,
td div {
  width: 100%;
}

td button.btn.btn-success {
  padding: 0;
}

td button.btn.btn-success::before {
  content: '\00a0';
}

table th,
table td {
  padding: 0 !important;
}