JSFiddle - React, Tailwind, and code Playground
HTML
<table cellspacing="0">
<tr>
<td>Row 1</td>
<td><button>Button 1</button></td>
</tr>
<tr>
<td>Row 2</td>
<td>Before content<div style="position:relative"><button>top:0;right:0</button></div>Aftercontent</td>
</tr>
</table>
<h3>Expected button positioning</h3>
<div class="row">
<div class="cell">Row 1</div>
<div class="cell"><button>Button 1</button></div>
</div>
<div class="row">
<div class="cell">Row 2</div>
<div class="cell">Before content<button>top:0;right:0</button>Aftercontent</div>
</div>
CSS
button {
position:absolute;
top:0;
right:0;
}
.row{position:relative;clear:both;width:100%}
.cell{display:table-cell}
/* Non essential styles */
td, .row {
background:#cde;
border-bottom:1px solid #ccc;
padding:1em;
}
table {width:100%}