相同大小的表单元格填充包含表的整个宽度

Just use percentage widths and fixed table layout:

<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</table>

with

table { table-layout: fixed; }
td { width: 33%; }

Fixed table layout is important as otherwise the browser will adjust the widths as it sees fit if the contents don't fit ie the widths are otherwise a suggestion not a rule without fixed table layout.

Obviously, adjust the CSS to fit your circumstances, which usually means applying the styling only to a tables with a given class or possibly with a given ID.

You don't even have to set a specific width for the cells, table-layout: fixed suffices to spread the cells evenly.

ul {
width: 100%;
display: table;
table-layout: fixed;
border-collapse: collapse;
}
li {
display: table-cell;
text-align: center;
border: 1px solid hotpink;
vertical-align: middle;
word-wrap: break-word;
}

<ul>
<li>foo<br>foo</li>
<li>barbarbarbarbar</li>
<li>baz</li>
</ul>

Note that for table-layout to work the table styled element must have a width set (100% in my example).

Using table-layout: fixed as a property for table and width: calc(100%/3); for td (assuming there are 3 td's). With these two properties set, the table cells will be equal in size.

Refer to the demo.

Just put this lines to your table style:

#table_name{
table-layout: fixed;
width: 100%;
}

You have a good example on this codepan.

This is late answer, but it will help for future searches.