可维护的背景流血

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"类引起的.我尝试删除类,填充是四舍五入.

编辑2:进一步的实验表明,这很可能是因为MediaWiki使用jQuery的.css()方法设置wikitables的填充(或其他等效的,不会围绕基于em的测量.任何想法如何克服这个？

Answer 1

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