How to overlap a image on a div?

I want to place a small circular login image on the border of div such that half image will be outside the border line just for style purpose?I think I have to set z-index but how OR is there any better way?

Solution

Thats exactly what you need to do.

Give you img a class name. Then in your style sheet add something like this

#classname  
{
position: absolute;
z-index: 10;
top: #distance from top of page#
left: #distance from left of page#
}

z-index needs to be a number greater than your div which will have an index of 0 if you haven't changed it.

Hope this helps.