<div style="border: 4px dotted black; height:100px; width: 100px"></div> results in different render output on Safari, Chrome and Firefox browsers (different corner styles, different dot styles).
Created attachment 30248 [details] dotted border: Firefox rendering
Created attachment 30249 [details] dotted border: Safari rendering
Created attachment 30250 [details] dotted border: Chrome (Skia) rendering
CSS spec says that "dotted" should be "a series of round dots", so Firefox is more accurate in that regard: <http://www.w3.org/TR/css3-background/#the-border-style> It also says "Implementations are encouraged to choose a spacing that makes the corners symmetrical", so Chrome/Safari are better there.
*** Bug 44611 has been marked as a duplicate of this bug. ***
Is there any hope for this bug being fixed? Dotted line means round "dots". It's not a dashed line as rendered in WebKit.
Martin is taking care of this on Qt port, a patch is coming soon :)
I'm interested in fixing this. And in adding a value to border (and everywhere) to accept short dashes as well, so authors have the option of round dots or tiny squares. That would be useful.
<rdar://problem/30740942>