如何根据其文本内容动态设置html表列的宽度？

Question

有一个html table：

<table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td width="480px"  class="societe" ><div style="float:left;font-size:12px;padding-top:2px" ><?php echo $_SESSION[PROJET_REF] ?> - [<?php echo $_SESSION[MANUEL_REF] ?>]</div>
      </td>
   </tr>
   ...
</table>

该css“兴业”是：

.societe{

    text-align:left;
    padding-left:23px;
    font-size:11px;
    font-weight:bold;

    background: url(../include/images/societe.png) repeat-x;

    }

在column定义中：<td width="480px" class="societe" >我将列的宽度硬编码为480px。这样做不是很好！那么如何动态地使宽度适合列的文本宽度呢？这里的文字是<?php echo $_SESSION[PROJET_REF] ?> - [<?php echo $_SESSION[MANUEL_REF] ?>。

Answer 1

如果要td根据文本动态更改宽度，则不应为td元素提供任何预定义的宽度。

在此示例中，您可以看到第一个td具有长文本，因此td，同一列中的所有都将根据td同一列中的最长设置其宽度。

最后，它归结为用户体验。是用户愿意选择td宽度可变的td字体，还是用户希望尺寸相等的字体，如果文字提示的长度大于宽度，则工具提示会显示完整的文本td。我的朋友，那是您必须做出的选择:)