可维护的背景流血

时间:2012-11-15 12:39:11

标签: jquery css mediawiki

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

{| 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的测量。任何想法如何克服这个?

1 个答案:

答案 0 :(得分:0)

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