JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<tr>
<td class="dc">/xamin/dat/TD/prod/dayrun/asstinv.seq /xamin/dat/TD/prod/dayrun/lacpd.txt /xamin/dat/TD/prod/dayrun/linvac.txt /xamin/dat/TD/prod/dayrun/holdinv.seq /xamin/dat/TD/prod/dayrun/pendinv.seq /xamin/dat/TD/prod/dayrun/traninv.seq /xamin/dat/TD/prod/dayrun/exchinv.seq /xamin/dat/TD/prod/dayrun/xrefinv.seq
<td>
Here is the next cell in my table
</td>
</tr>
<tr>
<td>
And here is the next row
</td>
<td>
With something arbitrary
</td>
</tr>
</table>
<hr>
<table>
<tr>
<td>
<div class="dc">
/xamin/dat/TD/prod/dayrun/asstinv.seq /xamin/dat/TD/prod/dayrun/lacpd.txt /xamin/dat/TD/prod/dayrun/linvac.txt /xamin/dat/TD/prod/dayrun/holdinv.seq /xamin/dat/TD/prod/dayrun/pendinv.seq /xamin/dat/TD/prod/dayrun/traninv.seq /xamin/dat/TD/prod/dayrun/exchinv.seq /xamin/dat/TD/prod/dayrun/xrefinv.seq</div>
</td>
<td>
With something arbitrary
</td>
</tr>
<tr>
<td>
And here is the next row
</td>
<td>
With something arbitrary
</td>
</tr>
</table>
CSS
table {
width:100%;
}
table td {
border: 1px solid black;
padding: .5em;
}
div.dc, td.dc {
white-space:normal;
word-wrap: break-word;
max-width: 10em;
background: #eee;
}