How to adjust width of all store pages?

[macromark]

Hi guys... my company just upgraded from Able 5.5 to 7 and we're getting started this week. I want to use the "Glass-SilverAge" theme as a starting point but the first thing I need to do is limit the page width to something less than 100%. I've been tweaking the style.css by making changes to the section with #outerContentWrapper but that's not working. Any help would be really appreciated.

Thanks, Mark

[mazhar]

In theme's style.css file locate following two styles and specify fixed width for them like.

Code: Select all

#storeHeader 
{
.................
.................
width:960px;
}

#outerContentWrapper 
{
.................
.................
width:960px;
}

[macromark]

Thanks Mazhar, that worked! One more problem... The header is centered on the page and the rest of the page is aligned to the left. I would like the whole page centered. I'm assuming I need to add something to the "outer wrapper" css code to do this, yes?

Here's what I have:

/* outer wrapper for the main page content */
#outerContentWrapper {text-align: center; width: 960px; }
#innerContentWrapper { background-color:#E3EFFF; margin: 0; text-align: left; }
table#contentLayout .form tr {border:solid 8px #E1EAEF; background: #FFFFFF; color: #416573; d}
table#contentLayout { width:100%; }

#outerFrame{}

/* style for the outer store header container */
#storeHeader {
width:960px; margin: 0 auto; background: #FFFFFF url(images/header_bg.gif) repeat-x; border: 1px solid #4F616D;
border-top: 0; border-bottom: 0;}

[macromark]

Nevermind I fixed it by adding margin-left and margin-right attributes:

/* outer wrapper for the main page content */
#outerContentWrapper {text-align: center; width: 960px; margin-left: auto; margin-right: auto; }