jsFiddle

HTML

<div></div> <img src="http://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg">

CSS

body { background-color: blue; } div { background-image: url(http://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg); background-size: cover; } div, img { width: 100px; height:100px; border-radius: 50%; }

img

When border-radius is applied on an image, the areas that got rounded off can still be clicked on. If you click on and drag the area just outside the circle, you will see it's possible.

div

However, when you apply border-radius to a div , the rounded off areas are not part of the div and it is truly a circle.