How to Trick out your Profile

Great example of a customized profile right here: http://nonoba.com/404/

^Actually, that's an example of a all around great user!

Anyway, I'm sure many of you not-so-CSS-enlightened people might like to know a bit about how do this with you profile. Well, I'm about to show you a few tips I learned from stealing the code from other people's profiles.



Step 1:
go to your profile > edit > profile text > edit stylesheet (on the right)


Giving your self a background

Add this to the code:

body {
background-image:url(//put the location of your image here/);
}

changing header color

change the color of different titles by this code:

h1, h2, h3 {
color:#FFFFFF !important
}

h5{
color:#222255!important
}

You can also change other things, like type font, but I'm too lazy to type all that up, so go do some research if you want that.

online status

this is that little box thing that tells if you're online or not

.onlinebox{
background-color:white;
color:black !important;
border:1px solid gray;
}

^controls color and borderline (I ripped this with virtually no adaptation from chris's profile)

something or other...

.section{
background-image:url(/location of your desired image/);
background-repeat:repeat-x;
}

I'm not completely sure what to call this, but it's pretty obvious what it does once you try it out.

comments

P { color: #777777 }
SUB { color: #000000 }

This can control your comment's colors and such, I forget exactly what does what though.

hmmm...

that bolding and underlining technique didn't work as I wanted it to...

Well this was useful. I just used the background commands (or whatever they are called) but thanks for the tips.

This was certainly very useful! With your help I was able to experiment and expand the CSS coding while I was editing my profile too. Thanks so much!

Now if only there was a way to add flash based music playlists onto one's profile.

Or is there? O_o

Wow... Simon doesn't make sense <33

does someone know if and how I can erase the background of your comments?

I don't know what I have to write: .comment self {, ".comment self" {, ."comment self" { or anything like that?

Change the part of this:

body {
background-image:url(//put the location of your image here/);
}

To this:

#page {
background-image:url(//put the location of your image here/);
}

so that way it will work.

This is beginning to get very frustrating... I cant seem to get the background that i want to use to appear on top of the page.. It shows up behind all of the tables... Any help?

goood:-)

.section, .p {background:none}

.p {font-weight: bold}
and
.p {text-decoration: underline}

found out, it's: .comment.self {background: none}

how do u change the background of the info. box, and such.. and how do u make the tables transparent to see the background??

still dont get how to put somthing in the background
auuuuuuuuuu!!! u.u!!!
xD

go to your page, look at the text that is in the boxes you want to change, view source, find that text, grab the class or id of the section you want, or the chain of classes and elements, then use css to modify the appearance of those sections.

yea my avatar is... messed up i cant get to WORK T-T

what does location of image mean?