当时的需求是这样的:

表格第一列显示日期,文字垂直居中;表格行数不确定;使用虚线分割

使用Chrome 14.0.835.35 测试,表现如下:

chrome下的border bug

点我看Demo

行数不确定,需要垂直居中,自然就用了table套table。
在Chrome下诡异的事情发生了,日期上下出现了实线。只有在Chrome能看到哦,Safari下也木有哦~
当时试了很多很多方法来写border,无论怎么写,还是会出现同样的问题。

小结

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

本文作者:admin 转载请注明来自:携程设计委员会