Central Column width

I’m working on a cart (version 2) and I’m having issues trying to get the centre column to display correctly

I’m using the basic skin

The cart is 1000px wide, and both the left and right columns are 200px wide.

I can’t seem to get the centre column adjust to the correct width, parts of it appear behind the left and right columns

Any suggestions?


You may have to assign a width to your container. Needless to say your visitors will have to scroll side to side to view your site. Not an optimal situation.


I’ve set the size in the style.base.css

/* Styles for the fixed width layout /

#container {

padding: 0px 0px;

width: 1000px;

margin: 0px auto;


#content {}

.central-column, .container-right .central-column, .container-left .central-column {

float: left;

display: inline;

margin: 0 172px 15px 172px;

padding: 0 21px 15px 21px;

overflow-x: auto;

overflow-y: hidden;

width: 614px;

background-color: #00FF00;


.central-content {}

.container-long .central-column {

margin: 0;

padding: 0 0 30px 0;

width: 100%;


.container-right .central-column, .container-left .central-column {

margin: 0 0 15px 172px;

padding: 0 0 15px 21px;

width: 773px;


.container-left .central-column {

margin: 0 172px 15px 0;

padding: 0 21px 15px 0;


.left-column {

float: left;

width: 200px;

margin-left: -988px;


.right-column {

float: left;

width: 200px;

margin-left: -210px;


/Styles for the fixed width layout */

I have the correct width for the site and for the columns, I just can’t get the center column to stay between the left and right columns.

I’ve tried changing the values in the .central-column but all it seems to do is push the navigation out of place.

The 1000px site width is to match an existing site

Look in styles.css around line 330

Note that in cs-cart, the load order is central, left, then right!!! The central column for both fixed width and variable width is postitioned with a margin. So if your left column is 200px (versus the standard 120px) you will probably have to adjust all the margins for all divs within the central column.

When I made my site completely variable, I had to change the load order to a more normal left, center, right in main.tpl. Then the left and right columns can be specified as percentages rather than fixed widths.

I asked why they did it that way and they responded that the central content was more important! Not sure what that has to do with anything so I gave up asking questions about it.