怎么禁止 table 出现横向滚动条?

Question

<table id="table1" border="1" width="100%" style="overflow:hidden">
<tr>
    <td width="100px">Firstname</td>
    <td>Petedfsdfsfsfdsfsfsadaffsafsffdaffsafsfgdgdfsgdsgsfsfgdgdfsgfsfgsfsfgdgdfsgfssfsfgdgdfsgfsdgdfsgdsgsdsgsfsfgdgdfsgdsgsfsdfr</td>
    <td width="100px">Lastname</td>
</tr>
</table>

如上,想让表格的第一列和第三列固定,中间自适应.
期望的效果是中间的文字超出的时候会隐藏,但实际却是会无限的伸长,出现横向滚动条....
请问这种情况改怎么解决,还是 table 无法达到这种效果

Answer 1

#table1{
    table-layout: fixed;
}

demo:链接描述