CSS虚线边框渲染问题

Question

我看到类似于CSS dotted border issue in adjacent columns in a table rendered as dash in Chrome的2px虚线边框的渲染问题，但在桌面Safari和Chrome上。我试了几个宽度和它在所有这些

的情况这是一个示例：

垂直线的结局有同样的问题，但它是出来的图片。

样品： http://jsfiddle.net/bcdQQ/

Answer 1

此问题发生，如果宽度不是由边框宽度整除。

这工作： http://jsfiddle.net/bcdQQ/5/（我做到了一点点变大，为了更好的视线）

#prodpre { 
    border-bottom: #555 5px dotted; 
    height: 20px; 
    margin: 0px 0px 2px 0px; 
    padding-bottom: 10px; 
    width: 505px; 
} 

因此，要抓住这个问题的唯一可能性，将是一个JavaScript的解决方案，其中纠正的宽度div，所以它可以被边界宽度整除（因为它在你的例子中是动态的）。

Answer 2

你可以把它放在一个更小的容器div与溢出隐​​藏？