jquery - 维基背景出血

标签 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
|}

但是,红色背景向右“渗出”。即,在表格右边框的右侧,有一条垂直的红色 strip 。

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

这可以通过单独给单元格一个基于 px 的填充来解决。但这会使代码复杂化,因此我正在寻找更简洁的解决方案。


编辑:还需要注意的是“未舍入”行为是由“可维基”类引起的。我尝试删除类并且填充是圆形的。

EDIT2:进一步的实验表明,这很可能是因为 MediaWiki 使用 jQuery 的 .css() 方法(或其他等效方法,不对基于 em 的测量进行舍入。任何想法如何克服这个?

最佳答案

如果你使用 table { border-spacing: 0; },空白不见了。在 Chrome 上测试,其中 border-spacing 最初设置为 2px

关于jquery - 维基背景出血,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13397698/

相关文章:

jQuery 显示/隐藏基于另一个下拉选项的下拉选项

html - 如何在 IE 中将 div float 在屏幕底部?

php - 使用 XAMPP 从/opt/lampp/目录的副本恢复 MediaWiki wiki

mediawiki - 维基百科的 "What links here"是如何工作的?

Mediawiki API : How do I list all pages of a category and for each page show all of it's categories?

javascript - bootstrap slider - 获取 data-slider-min 和 data-slider-max 值

jQuery 日期和时间选择器在特定日期的不同时间

javascript - 如何在行表中查找div元素并返回值?

css - 如何将 2 个相对 div 相互定位/顶部 css 属性在浏览器中有所不同,使用 css 以便它们在所有浏览器中显示相同?

javascript - Reactabular:如何改变一列的宽度? CSS 文件在哪里?