Monday, February 3, 2014

Rounded Avatars CSS3 Border Radius


As there is a Trends of Rounded Avatars in Blog Comment Area with Some other Beautiful Transitions Using CSS3
The Rounded Avatar is Not by Cropping Image in Circle it Acatally Masking Image in Circle.
CSS Code:

.avatar-box{border: 2px solid #c7b89e;}
.avatar-box,.avatar-box img{
 width: 50px;
 height: 50px;
 -webkit-border-radius: 30px; /* Saf3+, Chrome */
 border-radius: 30px; /* Opera 10.5, IE 9 */
 /*-moz-border-radius: 30px;  Disabled for FF1+ */
}

Demo :

The Beautiful Rose Hair Style images is Delivered by Share U Like

No comments:

Post a Comment