Django模板 - 2个HTML表需要它们匹配

Question

我创建了以下表格，这些表格会根据不同的内容进行动态更改。列宽都是计算出来的，我将它们输出到单元格内以及宽度样式中。我以这种方式使用了2张桌子，使其表现得好像顶部部件被锁定而底部移动。 我不能让这些表格排成一行。我已经包含了带百分比的图片和带有像素的图片。他们的百分比排队更好，但我仍然希望他们尽可能接近排队。

Answer 1

我的猜测是你的borders弄乱了你的计算。顶行没有任何单元格，因此没有边框。因此，当您设置1200px时，您需要计算包含边框的每个单元格width。 css不会出现这种情况。因此每个单元格都有1px border，你最终会得到一个偏移量。而且由于你在第二张表中有几个没有边框的单元格，它会变得更加混乱。

您现在可能拥有的是，在第一个表格中，1200px加1px每border排成一行，因为表格会自动适合width的{​​{1}}细胞。在第二个表格中，它会比顶级表格少一些，因为第一行有一些合并的单元格。 在第二个表中，可能相反，第一行你有一个100％的顶级表，然后第二行没有足够的位置来包含border所以你的最后10％将不是真正的10 ％。在第二个表中，由于合并的单元格，它会更好一点但仍然有点短。

您可以做的是暂时将border设置为none，看看这确实是问题。

如果这是问题，您可以使用jQuery outerWidth()来设置维度而不是使用css。 OuterWidth设置包含border和填充的宽度，因此它会应用正确的css来获取正确的width。

请参阅http://api.jquery.com/outerwidth/#outerWidth-value