CSS table td width – 固定，不灵活
我有一张桌子，我想在td上设置30px的固定宽度。 问题在于，当td中的文本太长时，td被拉伸超过30px。 溢出：隐藏不工作，无论是在TD的，我需要一些隐藏溢出的文本，并保持TD宽度30px。
<table cellpadding="0" cellspacing="0"> <tr> <td>first</td><td>second</td><td>third</td><td>forth</td> </tr> <tr> <td>first</td><td>this is really long</td><td>third</td><td>forth</td> </tr> </table> 这不是最漂亮的CSS，但我得到这个工作：
table td { width: 30px; overflow: hidden; display: inline-block; white-space: nowrap; }
jsFiddle例子
你也可以尝试使用：
table { table-layout:fixed; } table td { width: 30px; overflow: hidden; text-overflow: ellipsis; }
不仅是桌子正在增长， 桌子本身也能增长。 为了避免这种情况，你可以给表分配一个固定的宽度，作为回应，强制单元的宽度得到遵守：
table { table-layout: fixed; width: 120px; /* Important */ } td { width: 30px; }
（使用overflow: hidden和/或text-overflow: ellipsis是可选的，但强烈build议更好的视觉体验）
所以，如果你的情况允许你给你的表分配一个固定的宽度，这个解决scheme可能是一个更好的替代scheme，其他给定的答案（有或没有固定宽度的工作）
上面的build议抛弃了我的表的布局，所以我最终使用：
td { min-width: 30px; max-width: 30px; overflow: hidden; }
这是可怕的维护，但比重新做所有现有的CSS网站更容易。 希望它可以帮助别人。
Chrome 37.对于非固定table ：
td { width: 30px max-width: 30px; overflow: hidden; }
前两个重要！ 其他 – 它的stream失！
这个解决方法为我工作…
<td style="white-space: normal; width:300px;">
在td放入一个div ，并给出以下样式width:50px;overflow: hidden; 到div
Jsfiddle链接
<td> <div style="width:50px;overflow: hidden;"> <span>A long string more than 50px wide</span> </div> </td>
只需将td的数量除以100％即可。 例如，你有4个TD的：
<html> <table> <tr> <td style="width:25%">This is a text</td> <td style="width:25%">This is some text, this is some text</td> <td style="width:25%">This is another text, this is another text</td> <td style="width:25%">This is the last text, this is the last text</td> </tr> </table> </html>
我们在每个td中使用25％来最大化整个表的100％空间
