Как сделать так, чтобы последняя ячейка строки в таблице занимала всю оставшуюся ширину
В приведенном ниже фрагменте HTML, как я могу сделать ширину столбца, который содержит «LAST»? занимают оставшуюся часть строки и ширину столбцов, которые содержат «COLUMN ONE»; и «КОЛОННА ВТОРАЯ»; быть достаточно широким, чтобы вместить их содержание, а не больше.
Спасибо
table {
border-collapse: collapse;
}
table td {
border: 1px solid black;
}
<table>
<tr>
<td>
<table width="100%">
<tr>
<td>
<span>
COLUMN
</span>
<span>
ONE
</span>
</td>
<td>
COLUMN TWO
</td>
<td>
LAST
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
ANOTHER ROW
</td>
</tr>
</table>