border dotted merge at end on rounded values

Question

I am working on a site and struck on the code below

border:1px dotted black;

i need exactly a 200px width of dotted border but it produce a merged ending. Please look at the jsfiddle here. if i put 199px it was good at look. my question is Any way to make it look good(without merging ending) in 200px width?

Thank you.

Answer 1

Try giving it a border-right: 1px solid transparent; as suggested here: webkit renders last px of border:1px dotted; oddly

Updated your Fiddle

Answer 2

use

width:200px;

i think both r same pls check