ellipsis在table里失效

问题：display：table，或者table标签布局之后，设置td（table-cell）文字溢出隐藏ellipsis失效

解决方法：

1. 在table（display：table）的css样式中设置:table-layout:fixed;
2. 在table td 的css样式中设置： overflow:hidden;text-overflow:ellipsis;即可

出现频率太高，遗忘太快。

项目中最常用的布局如下：

<div class="table">
   <div class="table-row">
      <div class="table-cell"><div class="ellipsis">编号</div></div>
      <div class="table-cell"><div class="ellipsis">名称</div></div>
      <div class="table-cell"><div class="ellipsis">人数</div></div>
      <div class="table-cell"><div class="ellipsis">队伍人员</div></div>
      <div class="table-cell"><div class="ellipsis">投票</div></div>
    </div>
</div>
           

css代码：

.table{
    display:table;
    width：100%;
    table-layout:fixed;
}
.table-row{
    display:table-row;
}
.table-cell{
    display:table-cell;
    width:20%;
}
.ellipsis{
    width:100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
           

为什么要在table-cell里再套一层div，才赋ellipsis样式呢，大家自己试试就知道原因了~~