Question

我正在尝试创建一个这样的表：

{| class="wikitable" style="background:#F00;"
|-
! colspan="3" | Title
|-  
! style="border-width:1px 0px; width:20px" | A
! style="border-width:1px 0px;" | [[A]]
! style="border-left-width:0px; width:20px" | A
|-
| colspan="3" | Text
|}

然而，红色背景“流血”到右边。即，在桌子右边界的右边，有一条垂直的红色条纹。

使用开发人员工具仔细检查后，这是由于单元格的填充设置为0.2em，并且（奇怪地）没有舍入到整数像素，给出2.54999px填充。然后，浏览器将表格框呈现在右边框之外。

这可以通过单独为单元格提供基于px的填充来解决。但这使代码变得复杂，所以我正在寻找一个更简洁的解决方案。

编辑：还需要注意的是，“未整理”行为是由“wikitable”类引起的。我尝试删除该类，并且填充是四舍五入的。

EDIT2：进一步的实验表明，这很可能是因为MediaWiki使用jQuery的.css()方法设置了wikitables的填充（或其他等价物，它不会围绕基于em的测量。任何想法如何克服这个？

Answer 1

如果您使用table { border-spacing: 0; }，则空格会消失。在Chrome上进行了测试，border-spacing最初设置为2px。

可维护的背景流血

1 个答案: