Help please font colors

[Mrsb]

Hi ~ I am trying to change the color of the fonts on my site - http://www.designsbyj3.com
I have read everything I can get my hands on, I have changed, altered the css a million times and nothing I try is working!

Example the right and left box's - some are in white font, some are in black. I am trying to change them all to white.

/*list box contents*/
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}
.centerBoxWrapper {
border:1px solid #9A9A9A;
height:1%;
margin:1.1em 0pt;
}
h2.centerBoxHeading {
color:#FFFFFF;
font-size:1.3em;
/*sideboxes*/
}
.columnLeft {
}
h3.leftBoxHeading, h3.leftBoxHeading a, h3.rightBoxHeading, h3.rightBoxHeading a {
color:#FFFFFF;
font-size:1em;
}
#manufacturersHeading, #currenciesHeading, #musicgenresHeading, #recordcompaniesHeading, #searchHeading, #search-headerHeading {
color:#FFFFFF;
font-size:0.9em;
}
.leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
background-color:#ffffff;
background-image:url(../images/tile_back.gif);
margin:0em;
padding:0.2em;
}
.leftBoxContainer, .rightBoxContainer {
border-color:#ffffff rgb(154, 154, 154) rgb(51, 102, 51);
border-style:solid;
border-width:1px 1px 5px;
margin:1.5em 0em 0em;
}
.sideBoxContent {
background-color:#FFFFFF;
padding:0.4em;
}
h3.leftBoxHeading a:hover, h3.rightBoxHeading a:hover {
color:#FFFF33;
text-decoration:none;
}
.rightBoxHeading a:visited, .leftBoxHeading a:visited, .centerBoxHeading a:visited {
color:#FFFFFF;
}

I am completely at a loss! If anyone could please help me I would be forever in your debt! lol

Yes I have Firefox web developer - as well as Firebug - they don't tell me diddly!

Thank you in advance!

[gjh42]

You have stylesheetBAK.css in your /includes/templates/gloss_black/css/ folder, which is still loaded even though you have changed its name, comes after stylesheet.css, and overrides almost everything you do in stylesheet.css.
Everything with a .css extension in your /css/ folder will be loaded and applied.
Get rid of that and your life will be much easier.

[Mrsb]

Thank you! I was not sure what that was so I just left it there! I have removed it - and some of the fonts changed that I wanted. (your a legend!) but now...

I want the center to be white - it is now clear?
I also want to get rid of that green bit on the bottom of the side boxes - I have removed any green I could find in the CSS and it is still there? Suggestions?


Thank you so much! I was up for 2 nights trying to change those font colors!!

[Mrsb]

I got rid of the green YEAH! lol

Now - still trying to work out why the center is clear?

Thank you so much for your help!!!

[gjh42]

.centerColumn {background-color: #ffffff;}

You have this:

.leftBoxContainer, .rightBoxContainer {
border-color:#ffffff rgb(154, 154, 154) rgb(51, 102, 51);
border-style:solid;
border-width:1px 1px 5px;
margin:1.5em 0em 0em;
}

which makes the top white, left & right gray, and bottom green.

[Mrsb]

I found this -
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;

Is that where the centerColumn {background-color: #ffffff;} would go?

I am so sorry to be a pain!!

[gjh42]

No, you need the
.centerColumn {background-color: #ffffff;}
on its own line, so all those other things don't also get a white background.

It's good to keep similar declarations near each other, though, to make it easier to find things, and also good to keep properties of one selector in one place. So you could change the line you show to:

#bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
    padding: 0.8em;
    }

.centerColumn {
    background-color: #ffffff;
    padding: 0.8em;
    }

[Mrsb]

You are an angel!!! Thank you so very much for your help!!!

It worked!!

:) :) :) :)

[Mrsb]

When I added the centerColum it changed it to white - but now it does not go all the way to the bottom- example if you click on a catagory the white is only half a page? I am not sure if that makes any sense!
You can see what I mean here
http://www.designsbyj3.com

Thanks!!

[gjh42]

Unfortunately there is not a good handle to address the entire center column with - .centerColumn addresses the div inside the <td>, but there is no universal way to address that <td> by itself. A table cell always extends as low as the longest of its neighbors, but divs don't do that.

However, since you actually want left, right and center columns all to be white bg, you can move the property to #contentMainWrapper, which encloses all three.