代码之家 › 专栏 › 技术社区 › B. Clay Shannon-B. Crow Raven

如何限制HtmlTable列的宽度?

html-table css html

B. Clay Shannon-B. Crow Raven · 技术社区 · 9 年前

我需要减少HTMLTable列的宽度,并在其中包含文本内容。

我试图设置宽度并强制文本换行的所有操作都失败了。下面是html:

<td width="40" class="skybluebackground centertext"><label class="wrappable"><strong>Total Expenses</strong></label></td>

…其他行在该列中具有如下单元格(数字输入元素):

<td width="40"><input width="40" type="number" step="0.01" min="0" 
name="airfareTotalExpense" id="airfareTotalExpense"/></td>

试图减少这些数字输入元素的宽度也失败了。

我尝试过的CSS:

.wrappable {
  width: 10em;
}

我也尝试过设置其他几个属性,但显然没有任何效果。

我也尝试过:

费用总额

使用此CSS:

td.可重复{ 宽度:5米; }

…但这也不起作用——对于我来说,列太宽,因此文本不会换行。

我也在HtmlTable上尝试过:

 <COLGROUP WIDTH="48"></COLGROUP>
 <COLGROUP WIDTH="32"></COLGROUP>
 . . .

……但也没有效果。

在HTMLTables上设置列宽并不难;我在这里缺少什么?

1 回复 | 直到 9 年前

Paul Redmond 9 年前

标签是一个内联元素,因此设置的宽度不起作用。将其更改为 block 或 inline-block .

.wrappable {
  display: inline-block;
  width: 100px;
  border: 1px solid #333;
}

推荐文章

Softly · 单选按钮未按预期取值

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Thirumal isireddy · 在导航栏顺风css中,img被扭曲,而不是将元素推到旁边

1 年前

eXor420 · 如何在脚本标记中使用导出的函数?

1 年前

Hadi · 如何在无效和有效输入中选择用于更改样式的psoudo元素(after)

1 年前

IonicMan · 剑道网格在宽度过大时不显示某些列

1 年前

Kernier · 如何将数学公式支持添加到StacksEditor?

1 年前

Md. Ibrahim · CSS网格项溢出小屏幕滚动

1 年前

Arjun V Srivatsa · 如何将系统时区信息分配给javascript中的变量?

1 年前

Akshay mek · Vscode扩展建议不适用于某些文件夹

1 年前