Rounded Corner (border radius) to Image Issue

Many times when we develop a theme, and need to round corner to image (circular) but many browser not support it and image not perfectly rounded or not support specially in safari browser.

so today i will tell you how to fix the issue of rounded image effect easily and support in all browsers.

Because of such behavior of the browser, when creating an image in a circle with a border, we have to make sure both the image and the border are given a border radius. One way to ensure this is to separate the border from the image by placing the image inside a container, and apply border radius to both of them.

Here is below code which help you to do this task easily.

For the best possible browser support, you should prefix with -webkit- and -moz-:

now you can see the perfect rounded image.

“Rounded Corner (border radius) to Image Issue”