Cart Messing up my layout!

[tenessaa]

ACK.. I'm losing my mind. When you add something to the cart and all the way through checkout, my right sidebar goes insane. It expands and distorts the rest of the page. Can someone take a look? Items are all free right now.

http://www.digiscraplife.com/store

Any suggestions would be appreciated.

[stevesh]

Check the LABEL statements in your style sheet - you have a couple with widths of 11em and 15 em.

[tenessaa]

any suggestions on what they should be? I didn't edit those that's what came with zencart install. Should I try smaller or larger. I'm just getting started in php and am unfamiliar with the em measurement

[gjh42]

Find this in your stylesheet:

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

#cartBoxListWrapper and #cartBoxListWrapper ul are both being defined as 720px wide.
You need to separate those selectors into two lists, one with the width and one without. Decide which elements you really want to be that wide.

"em" is a measurement relating to font size. It essentially is a width equivalent to an "m" character in the particular font; for general Zen Cart purposes, the base font is 10px high and an em is 10px - this makes converting between em and px easy. In places where you have different size text, an em may be a different size also. This helps when making page layouts that allow users to display larger fonts for reading without destroying the layout - the whole layout will expand with the text.

[tenessaa]

Bless you you are a GOD!

Find this in your stylesheet:

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

#cartBoxListWrapper and #cartBoxListWrapper ul are both being defined as 720px wide.
You need to separate those selectors into two lists, one with the width and one without. Decide which elements you really want to be that wide.

"em" is a measurement relating to font size. It essentially is a width equivalent to an "m" character in the particular font; for general Zen Cart purposes, the base font is 10px high and an em is 10px - this makes converting between em and px easy. In places where you have different size text, an em may be a different size also. This helps when making page layouts that allow users to display larger fonts for reading without destroying the layout - the whole layout will expand with the text.