Question

Hey guys I want to add a 4px white circular border around this circular png.

http://oi45.tinypic.com/n6uo8o.jpg

I could not do this in the picture itself because i want a hover effect later.
Please help! Thanks.

Answer 1

HTML:

<img src="http://oi45.tinypic.com/n6uo8o.jpg" alt="" />

CSS:

img {
width:180px;
height:180px;        
border:2px solid red;
border-radius:90px;   
}

this CSS will have no white space betweed the “face” and the border:

img {
width:180px;
height:180px;        
border:5px solid red;
border-radius:90px;
background:red;
}

http://jsfiddle.net/ue9sG/