CSS - 显示：表格单元格和固定宽度 [英] css - display: table-cell and fixed width

问题描述

我有一些 divs 和 display：table-cell style，我想设置固定宽度 divs ，如果内容不合适，请将内文截断。

 < div class =row> 
< div class =cellstyle =width：100px;>不应该适合100px< / div> 
< / div> 
  

CSS

  .row {
 display：table-row; 
} 
 
 .cell {
 display：table-cell; 
 border：solid 1px #DADADA; 
 white-space：nowrap; 
 overflow：hidden; 
文本溢出：省略号; 
} 
  

> FIDDLE DEMO

是否可能？

解决方案

您可以设置 max-width 代替：

 < div class =cellstyle =max-width：100px;>不适合100px< / div> 
  

小提琴

I have some divs with display: table-cell style and I would like to set fixed width on the divs and to truncate the text inside if it doesn't fit.

HTML

<div class="row">
    <div class="cell" style="width:100px;">Should not fit in 100px</div>
</div>

CSS

 .row {
     display: table-row;
}

.cell {
    display: table-cell;
    border: solid 1px #DADADA;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

FIDDLE DEMO

Is it possible?

解决方案

You can set max-width instead:

<div class="cell" style="max-width:100px;">Should not fit in 100px</div>

fiddle

这篇关于CSS - 显示：表格单元格和固定宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！