th和td宽度不起作用

Question

如果文本太长，我应该缩短我想要行的第一个元素的表格。为此，我使用

#name{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

我有这张桌子，只想要＆＃34;我＆＃34;你可以使用缩写文本应该很长

＆＃13;

＆＃13;

#name{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

＆＃13;

<table style="width:100%">
  <thead>
    <tr>
      <th id="name" style="width:20%">Test name test name test name</th>
      <th id="number">547821365</th>
      <th id="address">test #10900</th>
    </tr>
  </thead>
</table>

＆＃13;

＆＃13;

＆＃13;

但是这不起作用，第一个元素总是根据文本放大并中断我的其他列。

Answer 1

您可以将float：left添加到您的名称css类中。这是我的小提琴 - http://dojo.telerik.com/ifEvu

＆＃13;

＆＃13;

<table style="width:100%">
  <thead>
    <tr>
      <th id="name" style="width:20%">Test name test name test name</th>
      <th id="number">547821365</th>
      <th id="address">test #10900</th>
    </tr>
  </thead>
</table>

＆＃13;

{{1}}

＆＃13;

＆＃13;

＆＃13;