[ Poll ] CSS Profile Codes Tutorial -- A Comprehensive Guide

How do you like the new tutorial???

Excellent!		38.9%	[ 5576 ]
Good!		11.6%	[ 1660 ]
Okay		8.5%	[ 1218 ]
Not so bad :(		3.1%	[ 451 ]
Horrible :( :( :(		5.5%	[ 794 ]
:ninja: .......GOLD!!!		32.3%	[ 4621 ]

Total Votes: 14320

[Marius Ruthven]

Aaaah it works! auto was missing, thanks Yoshi! blaugh

I have another question though...xD
how can i put more code into a background url instruction and not only one? for example:

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) 3600px 3600px ; }

If i want to put another instruction like no-repeat at the end it wont work, like:

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) 3600px 3600px, no-repeat top ; }

What should i do? how should i write these kind of code?

[Knight Yoshi]

Marius Ruthven

Aaaah it works! auto was missing, thanks Yoshi! blaugh

I have another question though...xD
how can i put more code into a background url instruction and not only one? for example:

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) 3600px 3600px ; }

If i want to put another instruction like no-repeat at the end it wont work, like:

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) 3600px 3600px, no-repeat top ; }

What should i do? how should i write these kind of code?

Sorry its slightly long. sweatdrop

As far as I know of you can't set exact pixel locations for images, you can set the image alignment which is
top left
top center
top right

center left
center center
center right

bottom left
bottom center
bottom right
body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) top left no-repeat scroll}
-----------------------------------------------------------------------------------------------------

Also, you already know about 'repeat' versus 'no-repeat', so I won't bother explaining it

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) top left no-repeat scroll;}
OR
body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) top left repeat scroll;}
------------------------------------------------------------------------------------------------------

And then last but not least is 'scroll' versus 'fixed'. As it sounds is what it does, 'scroll'when you scroll the page/box the image will 'scroll'with it. While 'fixed' keeps the image in one place.

body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) top left no-repeat scroll;}
OR
body { background: url(http://i18.photobucket.com/albums/b128/marius-kun/Dirge_Of_Cerberus_07800x600.jpg) top left no-repeat fixed;}

[Tick_FM]

great.
But i have a question: there is this.. some sort of a vertical border thing in my profile which i couldn't remove. if you look at it, you'll see it bothering the right side o_e and as my monitor is 1280x1024 it's horrible Dx you must know how to remove it >o>'

please?



edit: uhm.. how to get rid of the equipped list too? e_e

[Knight Yoshi]

Tick_FM

great.
But i have a question: there is this.. some sort of a vertical border thing in my profile which i couldn't remove. if you look at it, you'll see it bothering the right side o_e and as my monitor is 1280x1024 it's horrible Dx you must know how to remove it >o>'

please?



edit: uhm.. how to get rid of the equipped list too? e_e

1) #content {border: none;}

2) #profile ul.items {display: none;}

[Tick_FM]

Knight Yoshi

Tick_FM

great.
But i have a question: there is this.. some sort of a vertical border thing in my profile which i couldn't remove. if you look at it, you'll see it bothering the right side o_e and as my monitor is 1280x1024 it's horrible Dx you must know how to remove it >o>'

please?



edit: uhm.. how to get rid of the equipped list too? e_e

1) #content {border: none;}

2) #profile ul.items {display: none;}

oh, thanks a lot :'3

[Perfeccion]

Pretty useful guide, well done. And tysm because I'm doing my profile with this guide.

[Kao_kao_kat]

Do these CSS codes also work for FF?
I have my profile made; however, it only worked for Internet explorer, but now I've switched to Fire Fox for a lot of reasons. Before I restart on my profile I'd like some tips for Fire fox. Thanks!

[Knight Yoshi]

Kao_kao_kat

Do these CSS codes also work for FF?
I have my profile made; however, it only worked for Internet explorer, but now I've switched to Fire Fox for a lot of reasons. Before I restart on my profile I'd like some tips for Fire fox. Thanks!

Well because FF and IE are different you won't be able to satisfy everyone with your profile. If your using FF you should learn the cross browser differences when it comes to reading codes like CSS. For instance, IE doesn't recognize "overflow: auto" which FF does, overflow auto adds a scroll bar in which if the content exceeds the boxes set diameters it'll add a scroll bar instead of letting the content run on. Yes, the CSS codes work for FF though. Firefox also lets you hover over boxes and have significant changes. Like you can have it set to look like one box is minimized and when you hover it, it'll open up. IE can't read that so to IE the box doesn't really exist, another thing. FF is picky when it comes to image coding ex: #(section) {background: url('url here');}, note the single quote/apostrophe before and after the image URL, its recommended to always use it.

Need anymore help, feel free to ask.

--Knight Yoshi

[crazypieloverangel]

heart

[lovelylight6]

how do you change the delete button in the comment section?

[Daiseko]

lovelylight6

how do you change the delete button in the comment section?

I'm not sure you can change that, since it is only you who is viewing this button.

[crazypieloverangel]

Daiseko

lovelylight6

how do you change the delete button in the comment section?

I'm not sure you can change that, since it is only you who is viewing this button.

I agree with Daiseko..I don't think you can change it.

[Knight Yoshi]

lovelylight6

how do you change the delete button in the comment section?

Here's the best part, you can change/modify it
I know how ;]
#comments ul.admin ( Controls "Delete & Comment Back" )
#comments ul.admin a ( Controls "Comment Back" [the link, obviously] )
#comments ul.admin li ( Controls "Delete" )

[Soliaris Queen]

This has been VERY helpful and thank you! ^^ If you had it in here and i didnt see it i am SUPER sorry but...
You know how some people put a picture above all the about me, avi name and such? Do you do that by background images or someother way? Everything i try hasnt helped but if you people think of a way to help PLEASE reply/comment/PM me! ^^ Thanks!
3nodding xd 3nodding

[Passive Power]

Neat thanks. (Just testing out this quick reply thing i just noticed)