CSS显示：表格第一列太宽 [英] css display:table first column too wide

问题描述

我有如下这样的CSS表设置：

I have a css table setup like this:

<div class='table'>
 <div>
  <span>name</span>
  <span>details</span>
 </div>
</div>

该表格的CSS为：

.table{
 display:table;
 width:100%;
}
.table div{
 text-align:right;
 display:table-row;
 border-collapse: separate;
 border-spacing: 0px;
}
.table div span:first-child {
 text-align:right;
}
.table div span {
 vertical-align:top;
 text-align:left;
 display:table-cell;
 padding:2px 10px;
}

按现状，两列在宽度占用的空间之间平均分配的桌子。我试图使第一列的宽度仅与占据其单元格的文本所需的宽度一样

As it stands the two columns are split evenly between the space occupied by the width of the table. I'm trying to get the first column only to be as wide as is needed by the text occupying it's cells

表的宽度未知，列/

推荐答案

只要给它一个小的宽度，如 1px 。表格单元格始终会扩展到尽可能小的大小以适合其内容。

Just give it a any small width like 1px. Table cells always expands to the smallest possible size to fit its content.

这篇关于CSS显示：表格第一列太宽的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！