Welcome Enjoy Tutorials

Liked us?

Thursday, May 30, 2013

How Made Round and Augmented Avatars in Blogger

I've always tried to have a good design in my comments and now with the new nested comments CSS inadequacies all I had in my comments but thank God the CSS is wonderful and I've slowly been rebuilding and between those Rebuilding this the increase in size the avatar and change it so that by default is 36 * 36px and square but with a bit of CSS can be increased to 50px and put it round.

With the hack today I present the avatars remain as follows:


To add this trick WILL NEED paste before]]> </ b: skin> the following:

.avatar-image-container,
.avatar-image-container img{
 max-width:50px !important;
 width:50px !important;
 max-height:50px !important;
 height:50px !important;
 padding: 0 !important;
 border:0px;
}

With the above code will increase the size of the avatar to 50px, clarification you can increase even more the size of the avatar but it is highly recommended.

Now if you want round avatars paste before]]> </ b: skin> the following:

.avatar-image-container,
.avatar-image-container img {
 max-width: 50px !important;
 width: 50px !important;
 max-height: 50px !important;
 height: 50px !important;
 padding: 0 !important;
 border: 0px;
 -webkit-border-radius: 999px;
 -moz-border-radius: 999px;
 border-radius: 999px;
}

.avatar-image-container{
 border:3px solid #fff !important;
 -webkit-box-shadow: 0 1px 2px #BBB;
 -moz-box-shadow: 0 1px 2px #BBB;
 box-shadow: 0 1px 2px #BBB;
}

As time is very easy, I hope this little trick pleases you and use it.
Enhanced by Zemanta

No comments :

Post a Comment

Botones Isometricos de Social Media




Barra Lateral Fija