css 超出一行显示省略号，table-cell溢出

代码如下

<div class="circle">
11111123456789
</div>
<style>
.circle {
width: 100px;

overflow: hidden;   /*超出隐藏*/
white-space: nowrap; /*强制在同一行显示*/
text-overflow: ellipsis; /*省略号*/
}
</style>

关于table-cell溢出问题

<div class="test">
<div class="item">11111222333444</div>
</div>

<style type="text/css">
.test {
width: 100px;

display: table;
table-layout:fixed;  /*table-layout用来显示表格单元格、行、列的算法规则,fixed表示水平布局仅取决于表格宽度，不填这一项代表水平布局取决于内容*/

border: 1px solid red;
}

.item {
width: 100%;
display: table-cell;

overflow: hidden;
word-spacing: nowrap;
text-overflow: ellipsis;
}
</style>