Hello, Has anyone come across a cross browser method for successfully applying rounded corners to inline images?

Criteria: Image has rounded corners but itself is on top of another image (so can't use corner gifs) Image must be inline because it's uploaded via a CMS Image needs a border


1 answer


Have you tried border-radius? w3.org says it should work on all elements. You could give it a class or use something like:

#box img {border-radius: 5px; /* this is for future support */
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
border: 1px solid #000;}

As you have noticed this will not work in IE yet, give it time and in the meantime, they probably won't notice.

Answered almost 10 years ago by Ben Shoults