Account Status: All
Actions: Customize your Default Userpic
Theme: Flexible Squares (maybe more)
Happy New Year! Here is a Userpic Customization.
The Goal:
Centering your Default Userpic or Making it rounded
Centering:
.defaultuserpic, .defaultuserpic image { text-align: center; padding: 10px; margin: 0 0 8px 0; }
Rounded:
.defaultuserpic {
width: 100px;
height: 100px;
margin: 0px auto 10px auto;
padding: 7px;
background-color: #444444 !important;
border: 1px solid #777777;
-webkit-border-radius: 70px;
-moz-border-radius: 70px;
-ms-border-radius: 70px;
-o-border-radius: 70px;
border-radius: 70px;
}
.defaultuserpic img {
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
-ms-border-radius: 60px;
-o-border-radius: 60px;
border-radius: 60px;
}
You can also change the border-radius coding on both the ".defaultuserpic" & ".defaultuserpic img" to something like:
-webkit-border-radius: 5px 60px 5px 60px;
-moz-border-radius: 5px 60px 5px 60px;
-ms-border-radius: 5px 60px 5px 60px;
-o-border-radius: 5px 60px 5px 60px;
border-radius: 5px 60px 5px 60px;
Which will make it look like this:
If you reverse the numbers to 60px 5px 60px 5px you will have this "leaf" look going the opposite direction.
Questions? Please Comment.