首页 > 代码库 > td设置虚线dotted框,在chrome下有时会出现实线bug

td设置虚线dotted框,在chrome下有时会出现实线bug

chrome浏览器中,为td设置border:1px dotted #eee;时,有些地方会出现实线。

这是因为Chrome在border合并时,有点碰运气的感觉,两条虚线正好交错在一起时会合成一条实线。
Demo中table的宽度是886px,增加1px或者减少1px都可以解决这个问题。
有兴趣的童鞋还可以试着不断增加宽度,观察border交错时的变化,你会发现它6个像素为一个周期。

可参考 Chrome下的Border合并BUG http://ued.ctrip.com/blog/?p=2484

设置table的属性?border-collapse: separate;后暂时解决问题。