How to get perfect border radius on images in all browsers?

Question

Currently I\'m getting like this in Chrome, Safari, Mobile Safari and Opera. edges are rough.

<         


        

Answer 1

all browsers have different CSS capabilities, and handle them differently.

if you want the corners to look exactly the same in all browsers, you'll just have to put the curves in the actual image, and not rely on CSS.

An alternative is to use a background image on a div instead, which may get better clipping.