Bootstrap table left-column minimum width and content column max width.

example.png

table.html

<style type="text/css">
  #my-table td:first-child {
    white-space: nowrap;
  }

  #my-table td:last-child {
    width: 100%;
  }
</style>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<div class="container">
  <div class="row mt-3">
    <div class="col col-md-12">
      <table id="my-table" class="table table-hover table-striped table-bordered">
        <tr>
          <td><p>ID:</p></td>
          <td><p>1234</p></td>
        </tr>
        <tr>
          <td><p>Description:</p></td>
          <td><p>The short description.</p></td>
        </tr>
        <tr>
          <td><p>Long Description:</p></td>
          <td><p>An example of a longer description of text to fill the full width.</p></td>
        </tr>
      </table>
    </div>
  </div>
</div>