It was a long time I wanted to make a Maison Ikkoku header, and now i did it!
The layout is always the same by
, but I re-customize it to fit the header.
HEADER CREDITS
Textures:
°
Scrapbook Textures by
Sarahsaloser.
°
22 vectorized icon textures by
cielo-gris.
°
Big textures by
elrawien.
Brush:
Big Splash PSP Brushes by
Sumse.
Font:
Chinese takeaway LAYOUT CREDITS
Texture:
Textures number 5 by
seriouslywir.
INSERT AN IMAGE NEAR THE SIDEBAR TITLES
I don't know if it works on all layouts because I tried without really knowing what I was doing!
Minty Peach CSS codes are very simply to understand becouse she adds titles like "sidebar", "maincontent"... so you almost know "which codes changes what"...
- So... first of all upload a small image (on photobucket or something similar), mine was 22x18...
- Then go to CSS customize and search something like this:
li.sbartitle (=sidebar titles options)
{
padding-left: 0px;
padding-right: 0px;
text-align:left;
padding-left: 25px;*
padding-bottom: 2px;
[...]
- Now insert or change these:
background-color:; /*no backgound color means it will show the sidebar backround*/
background-image: url('
http://yourimage.png'); /*the image you want to insert*/
background-repeat: no-repeat; /*if you want to repeat or no the image*/
background-position: center left; /*position of you image*/
}
If you would more information about backround image and it's position:
Css.flepstudio.org/css-background (it's in Italian, but code are the same everywhere :P)
- in the end, if the title goes on the image, you could move the image (backround-position) or move the title (text padding *)
RE-SIZE USERPICS AND FRIENDSUSERPICS
_oluha_ lyout has this option, and I like it a lot!
So I check out this layout (
always Minty Peach) and I found the codes that re-size userpics and friends-userpics:
- Search in your layout this part (it's in maincontent):
.userpic {
position: relative;
float: left;
background-color: ;
background-image: url('http://...');
[...]
}
.userpicfriends {
position: relative;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
}
- Under these codes you could paste this:
.userpic img, .userpicfriends img {
background-color: #ffffff !important;
width: 50px; /*insert your value*/
height: 50px; /*insert your value*/
padding: 5px;
border: 1px dashed #eeeeee; /*insert your values*/
}
- That's all! :o