不能强制元素遵守一定的大小约束

Question

我有一张桌子：

• 第一行和第一行（期望原点（0; 0）单元格）包含按钮;

• 最后一行和列（期望它们的第一个相应单元格）为空;

• 中间的所有其他单元格（即不与表格边框相邻）是键;

• 使用JavaScript动态更改表格大小。

• 所有关键单元格（中间）的大小取决于它们的数量和col / row-span。例如，使用4个水平键，如果第二个键的colspan为2，则大小为25％，50％，25％，并且第三个键不存在。

jsFiddle

会让您看得更清楚

我希望包含按钮的<td>元素遵守以下约束：

• 对于水平按钮组（在第一行），固定高度，例如20像素;

• 对于垂直按钮组（在第一列上），固定宽度与上面大小相同（这将导致方形（0; 0）单元格）; < / p>

• 第一行的最后一个按钮（class =“AddCol”）必须与该行中的其他按钮具有相同的宽度（事实并非如此，我不会明白为什么这不是自动的......）;

• 第一列的最后一个按钮（class =“AddRow”）必须与该列中的其他按钮具有相同的高度（相同）。

你知道我怎么做吗？我试图添加隐藏的内容来填充“空”单元格“，我试图强制不同元素的大小等等......但我现在没有想法。

Answer 1

在table-layout: fixed;元素上设置大小时尝试<td>。