Forum Moderators: not2easy

Message Too Old, No Replies

I need to change only in one page background color in body.css

URGENT Please BODY.CSS

         

animmalbrown

1:45 am on Feb 28, 2007 (gmt 0)

10+ Year Member



PLease i have a website with a structure made in css and i just want to make the content table black, but when i add the color, in the body.css file it change all the pages content tables in black, i just need the homepage content table in black, not the rest of the pages. how can i overwrite a body.css only for the home page.
someone can help me out
i will appreciated so much
A

Quadrille

1:56 am on Feb 28, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



body2.css for that one page?

or same file.css, but a .body2 class?

[edited by: Quadrille at 1:57 am (utc) on Feb. 28, 2007]

Setek

1:57 am on Feb 28, 2007 (gmt 0)

10+ Year Member



You can put an ID on the homepage's
body
:

<body id="homepage">

...

</body>

And then use more specificity:

body { background-color: #fff; }
body#homepage { background-color: #999; }

Hope that helps :)

animmalbrown

2:17 am on Feb 28, 2007 (gmt 0)

10+ Year Member



hey guys thanks a lot but i really don't understand

here is the part i have to change in the body.css

i have this

#content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #FFFFFF;

so what i do is this to change this table in black that is what i need

#content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #000000;

but when i do this in this file body.css the rest of the pages become black and i only need the homepage black, so the rest of the pages i need them like this

#content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #FFFFFF;

how do i overwrite this file to the index.html reads me the body.css that contain the color 000000 without affecting the rest of the pages that i need them FFFFFF

so how i do this i only need the index content page in black not the rest of the site the rest of the site has to be like it was in white

#content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #FFFFFF;

i need someone explain me step by step how to do this please!
and thank you very much guys,

[edited by: encyclo at 2:24 am (utc) on Feb. 28, 2007]
[edit reason] no links to personal sites please, see forum charter [/edit]

rocknbil

4:57 am on Feb 28, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You can use a shortcut with an inline style if it's just this one page that needs the black background.

<table id="content" style="background-color:#000000;">

Of course this makes things harder to maintain because you have moved your presentation markup back into the page, but it will work for you.

You can add a new definition in your css file for just the main page, but this is an extra style you'll be carrying around that is only used once:

#main-content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #000000;
}

<table id="main-content">

Setek

5:19 am on Feb 28, 2007 (gmt 0)

10+ Year Member



You can use a shortcut with an inline style if it's just this one page that needs the black background.

<table id="content" style="background-color:#000000;">

Of course this makes things harder to maintain because you have moved your presentation markup back into the page, but it will work for you.

That's why I wouldn't do it too - if you need to change it to a different colour somewhere down the track, you have to go hunting (or the guy that replaced you has to go hunting.)

You can add a new definition in your css file for just the main page, but this is an extra style you'll be carrying around that is only used once:

#main-content {
position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #000000;
}

<table id="main-content">

I'd avoid this also - purely because it's repeating values common to both

#content
and
#main-content
.

What you could do is this:

in

index.html
, you have

<body>
<table id="content">

add this ID:

<body id="home-page">
<table id="content">

in

body.css
, you have:

table#content { position:absolute;
left:42px;
top:180px;
width:533px;
padding-bottom: 15px;
background-color: #fff; }

add this rule below that line:

body#home-page table#content { background-color: #000; }

That way, it's more easily maintainable.

animmalbrown

6:00 am on Feb 28, 2007 (gmt 0)

10+ Year Member



First of all thanks a lot,! now

i understand what are you saying but i can't make it work, i have in my desktop a folder called css that contain

3 files bodystyles.css menustyle.css styles.css

now i don't find where i can place this codes you just sent me and in my index.html page that is the ONLY PAGE THAT I NEED THE CONTENT IN BLACK i have this code:
------------------------------------------------------------------------------
[sorry too much code]

--------------------------------------------------------------------------
here you have the 2 codes i have my index.html and bodystyle.css with this 2 codes you can fix thi trouble i have or you need also the styles.css file and the menustyle.css

thanks a lot for the help i hope someone can provide me the codes back fixed so i can copy and paste, and upload see if it works i am new to css and i can't make only the index page of this website have the content black if i change the #FFFFF to #000000 all the pages become with the content tables black sucks

thanks a lot

[edited by: SuzyUK at 9:28 pm (utc) on Feb. 28, 2007]
[edit reason] Please see Forum Charter (above the thread) [/edit]

Setek

6:23 am on Feb 28, 2007 (gmt 0)

10+ Year Member



Sorry, I'm not going to copy and paste back your code with it fixed.

If you'd like to check the Forum Charter [webmasterworld.com]...

Fix My Code/Do My Homework
These type of posts are not all that welcome. This is a discussion board. If you have a problem, try to phrase your post in a manner condusive to discussion of the issue. We would like to teach people to help themselves.

We're not here to fix your code, we're here to teach you how to do something, and why to do it.

If you tried to copy and paste my example code into your stylesheet and wondered why it didn't work, it's possible it's because you don't have a single table on the page.

Thus the rule:

body#page-home table#content { background-color: #000; }

.. will never get initialised, because it's looking for a body element that has the ID "page-home", and within that it's looking for a table element that has the ID "content".

We know you're new to CSS, but at some stage we all were. You've got to start learning somewhere.

animmalbrown

6:40 am on Feb 28, 2007 (gmt 0)

10+ Year Member



OK I am sorry and Thanks a lot! for your help, it is my first time in this place and my first time trying to understand css. it is a difficoult lenguage for me, thanks a lot and i appologize.

Anibal