JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.4.0.js"></script>
<table>
  <tr>
    <th width="50%"></th>
  </tr>
  <tr>
    <td>
      <div class="div-with-border">
        <span>Sentence</span>
      </div>
     </td>
  <tr>
    <td>
       <div class="div-with-border">
         <span>It's a loooooong sentence</span>
      </div>
    </td>
  </tr>
</table>

CSS

.div-with-border {
  display: inline-block;
  border: 1px solid red;
  max-width: 100px;
}

table{
  width: 100px;
  font-size: 16px;
}

JavaScript

$(".div-with-border").each(function() {
	var textWidth = $(this).find("span").width();
  $(this).width(textWidth);
});