根据可用宽度设置表格单元格内容的宽度

Question

我有一个HTML表格,其中的单元格包含跨度,如下所示:

...
<td>
    <span style="height: 20px; width: 20px; margin-left: 2px;">
    <span style="height: 20px; width: 20px; margin-left: 2px;">
    <span style="height: 20px; width: 20px; margin-left: 2px;">
</td>
...

我正在寻找一种方法来缩小这些跨度的宽度,而不是换行,当包含的表格单元太窄而无法在一行上显示它们时.我试图玩弄跨度设置max-width到20px,然后使用宽度的百分比,但由于表格单元格试图只有一样宽,它的内容不工作.

最小表格单元格宽度是在1行上显示标题所需的宽度.

对于视觉类型,这是当我有足够宽度时我目前拥有的:

这是当我没有足够宽度时我现在拥有的东西:

当没有足够宽度的每个跨度为完整的20px时,我希望它看起来像:

在情况下,它并不明显,跨度是颜色的方块中TXEs,RDBs和RavenNets列.

Answer 1

我找不到令人满意的纯 CSS 方法来完成我想要的事情。我已经实现了一个应用程序配置文件（.ini或多或少像一个文件），所以我只是将所需的宽度添加到此配置中。它不是通用解决方案，但它非常适合我的要求。