How to make center column to be a different color than side columns

The colors I chose for my site need some tweaking. Where in the stylesheet do I change the color of the center column only? Thanks - Kelley

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
	margin: 0em;
	padding: 0em;
	}

delete #contentMainWrapper from the above rule and create a rule like below

#contentMainWrapper {
                margin: 0em;
                padding: 0em;
                background-color: #ababab;
                }

I must be missing something. When I followed the instructions it changed all three columns, not just the center one.

Website is www.espressoempire.com

Thanks.

My bad...:blush: change #contentMainWrapper to .centerColumn

oh and stick #contentMainWrapper back in the previous rule

That changed the color on part of the column. It also changed the space between the words on the top line and the top graphic so the graphic looks like it is under the column. There is now a big section of the old color at the bottom of the column.

The index page looks bad but the category page looks even worse.

i do not know exactly what you are seeking and looking at the site you may have corrected this.

Your areas are defined as(in the order they appear in your stylesheet)

.sideline {
width: 29px;
background: #7D5844;
}
#mainWrapper {
	background-color: #CEBA9A;
	text-align: left;
	width: 780px;
	vertical-align: top;
	border: 1px solid #9a9a9a;
	}
.centerColumn {
     margin: 0em;
     padding: 0em;
     background-color: #DFC8A4;
}
.centerBoxWrapper {
	background: #DFC8A4;
	border: 1px solid #9a9a9a;
	height: 1%;
	margin: 1.1em 0;
	}
.sideBoxContent {
	background: #DFC8A4;
	padding: 0.4em;
	}

I think that I got them all and you can adjust the colors as you wish

BTW: I like the direction that you are taking this with good graphics

The problem I have is that when I added .centerColumn {....... it messed up the layout. If the .centerColumn code under the #header wrapper code isn't there the graphics look great but the center column is the same color as the left and right column.

I am looking to just change the center column color. I will put the code back to the way it was so you can see the way the layout should be. The top graphic with the coffee beans in it doesn't get cut off when I remove the .centerColumn stuff but the center column reverts to the same color as the other two columns.

I am guessing but I think that you are wanting this: Look for it in the css and if it is not there add it:

#indexDefault {
background-color: #dfc8a4;
}

I need the center column on all pages to change color. Now that I added that you can see the problem clearly by looking at the index page then click on a category (click Wilbur Curtis). See the position of the center column changed on the index page but the color of the center column is correct. On the category page the position of the column is correct but the color is wrong.

Scrap my previous entry and find or add this and see if this helps

#center {
background-color: #dfc8a4;
}

How will that work with the code already there:

#center {
width: 376px;
background: url(../images/top.jpg) no-repeat top left;
padding-top: 50px;
}

Thanks! It worked.:D

Glad you tried it as you are in a better position to determine this as from a far the relative images do not diplay when in edit mode.

Good Luck