New products only display in one column

[Togfather]

I am just setting up the shop at http://www.kellys-pets.com.

On the front page the new products displayed in the centre appear on top of each other and I want them to show in three columns wide to avoid the big white space on the right.

However, when according to the manual (p255), I go to 'configuration', 'Index Listing' , 'New Products Columns per Row', it is already set to '3'

Can anyone tell me what I am doing wrong please?

Regards

Tog

[Togfather]

OK I have added a float: left command to the box in css and this has changed it, but it now seems that the box needs to be wider to accommodate 3 items.

Which page controls the width of the centre table?

[Togfather]

Changing the width of the centre column does not help. The problem seems to be the text below each item picture.

How can i restrict it's width?

I wanted to cancel this thread and start a new one, but cannot find out how to delete my post.

Many Thanks

Tog

[Togfather]

Strangely, if I change the number of columns from 3 to 4, it does display 3, and puts the fourth one in a seperate row below, so maybe it is not a width of text problem after all.

Could it be something wrong with my css code, and if so, what could it be. I have been trying all kinds of things for hours now and I want to scream!!.

Can anyone help me?

my css code is:
/**
* Main CSS Stylesheet
*
* @package templateSystem
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: stylesheet.css 4813 2006-10-23 02:13:53Z drbyte $
*/

body {
margin: 0;
padding: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 75%;
background-color: #F9F9F9;
color: #000000;
}

a img {border: none; }

a:link {
color: #446773;
text-decoration: none;
}

#navEZPagesTOC ul li a {
color: #446773;
text-decoration: none;
}

a.productListing-heading {
color: #FFF000;
text-decoration: none;
}

a:visited {
color: #446773;
text-decoration: none;
}

a:hover {
color: #b6c7cc;
}

#navEZPagesTOC ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
color: #b6c7cc;
}

a.productListing-heading {
color: #FFF000;
text-decoration: none;
}

#navMain ul li a:hover {
color: #b6c7cc;
}

a:active {
color: #446773;
}

h1 {
font-size: 1.5em;
color: #b6c7cc;
}

h2 {
font-size: 1.4em;
}

h3 {
font-size: 1.3em;
}

h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger{
font-size: 1.1em;
}

.biggerText {
font-size: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
margin: 0.3em 0;
}

/* Might uncomment either or both of these if having problems with IE peekaboo bug:
h1, h2, h3, h4, h5, h6, p {
position: relative;
}
*html .centerColumn {
height: 1%;
}
*/

CODE {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 1em;
}

FORM, SELECT, INPUT {
display: inline;
font-size: 1em;
margin: 0.1em;
}

TEXTAREA {
float: left;
margin: auto;
display: block;
width: 95%;
}

FIELDSET {
padding: 0.5em;
margin: 0.5em 0em;
border: 1px solid #8d12bb;
}

LEGEND {
font-weight: bold;
color: #446773;
padding: 0.3em;
}

LABEL, h4.optionName {
line-height: 1.5em;
padding: 0.2em;
}

LABEL.checkboxLabel, LABEL.radioButtonLabel {
margin: 0.5em 0.3em;
}

#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
}

LABEL.inputLabel {
width: 9em;
float: left;
}

LABEL.inputLabelPayment {
width: 14em;
float: left;
padding-left: 2.5em;
}

LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
width: 11em;
float: left;
}

#checkoutPayment LABEL.radioButtonLabel {
font-weight: bold;
}

P, ADDRESS {
padding: 0.5em;
}

ADDRESS {
font-style: normal;
}

.clearBoth {
clear: both;
}

HR {
height: 1px;
margin-top: 0.5em;
border: none;
border-bottom: 1px solid #8d12bb;
}

/*warnings, errors, messages*/
.messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {
line-height: 1.8em;
padding: 0.2em;
border: 1px solid #8d12bb;
}

.messageStackWarning, .messageStackError {
background-color: #ff0000;
color: #FFF000;
}

.messageStackSuccess {
background-color: #99FF99;
color: #000000;
}

.messageStackCaution {
background-color: #FFFF66;
color: #000000;
}

/*wrappers - page or section containers*/
#mainWrapper {
background-color: #ffffff;
text-align: left;
width: 950px;
vertical-align: top;
border: 1px solid #8d12bb;
}

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

#logoWrapper{
width: 900px;
margin: auto;
padding: 0em;
}

#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
margin: auto;
}
#navColumnOneWrapper, #navColumnTwoWrapper {
margin-left: 0.5em;
margin-right: 0.5em;
}

#navColumnTwoWrapper {
padding-right: 0.5em;
}

#tagline {
color:#446773;
font-size: 2em;
text-align : center;
vertical-align: middle;
}

#sendSpendWrapper {
border: 1px solid #8d12bb;
float: right;
margin: 0em 0em 1em 1em;
}

.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {
margin: 0;
width: 47%;
}

.wrapperAttribsOptions {
float: right
}

/*navigation*/

.navSplitPagesResult {}
.navSplitPagesLinks {}

.navNextPrevCounter {
margin: 0em;
font-size: 0.9em;
}
.navNextPrevList {
display: inline;
white-space: nowrap;
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
}

#navSuppWrapper {
margin: 0em;
padding: 0.2em;
font-weight: bold;
color: #446773;
height: 1%;
width: 95%;
border: 3px double #8d12bb;
text-align:center;
margin:auto;
margin-top: 5px;
}

#navCatTabsWrapper {
margin: 0em;
padding: 0.2em;
font-weight: bold;
color: #5937b5;
height: 1%;
width: 95%;
border: 3px double #8d12bb;
text-align:center;
margin:auto;
}

#navMainWrapper {
margin: 0em;
padding-top: 0.2em;
padding-bottom: 0.1em;
padding-left: 0.2em;
padding-right: 0.2em;
font-weight: bold;
color: #5934b5;
height: 1%;
}

#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0;
padding-left: 0.5em;
padding-right: 0.5em;
padding-top: 0.3em;
padding-bottom: 0.3em;
list-style-type: none;
text-align: center;
line-height: 1.5em;
color: #446773;
}

#navMain ul li, #navSupp ul li, #navCatTabs ul li {
display: inline;
}

#navMain ul li a, #navSupp ul li a, #navCatTabs ul li a {
text-decoration: none;
padding-left: 0.5em;
padding-right: 0.5em;
padding-top: 0.3em;
padding-bottom: 0.3em;
margin: 0;
color: #446773;
white-space: nowrap;
}

#navCatTabs ul li a {
color: #446773;
}

#navEZPagesTOCWrapper {
font-weight: bold;
float: right;
height: 1%;
border: 1px solid #8d12bb;
background-color: #ffffff;
}

#navEZPagesTOC ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
line-height: 1.5em;
}

#navEZPagesTOC ul li {
white-space: nowrap;
}

#navEZPagesTOC ul li a {
padding: 0em 0.5em;
margin: 0;
}

#navCategoryIcon, .buttonRow, #indexProductListCatDescription {
margin: 0.5em;
}

#navMainSearch {
float: right;
}

#navBreadCrumb {
padding: 0.5em 0.5em;
background-color: #ffffff;
font-size: 0.95em;
font-weight: bold;
margin: 0em;
}


#navEZPagesTop {
background-color: #ffffff;
font-size: 0.95em;
font-weight: bold;
margin: 0em;
padding: 0.5em;
}

#navColumnOne, #navColumnTwo {
background-color: transparent;
}

/*The main content classes*/
#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
vertical-align: top;
}

.centerBoxContentsNew {
float: left;
text-align: center;
}

/*.content,*/ #productDescription, .shippingEstimatorWrapper {
/*font-size: 1.2em;*/
padding: 0.5em;
}

.alert {
color: red;
margin-left: 0.5em;

[misty]

What happens when you switch to default Classic template?

[Togfather]

Hello Misty,

The grid displays correctly in classic green.

What have i done wrong?

Many thanks

Tog

[misty]

Hello Misty,

The grid displays correctly in classic green.

What have i done wrong?

Many thanks

Tog

You have done nothing wrong..problem is with template..
suggest you use another...

[Togfather]

But so much work has gone into customising this one - changing the template now would take days and the shop goes live very sooon - it is being advertised in trade magazines. Do you know which pages I can study that relate to this part of the site?

Many thanks

Tog

[Togfather]

I am resolving it now. I re-loaded the original stylesheet and I am working through it step by step to get the look I want again. As I change each part I am checking the appearance and that way I will discover which stylesheet change created the problem.

Thank you for your help

Regards

Tog

[kimberlyeddy]

Togfather (or anyone else), did you ever figure out what was the issue? I'm having the same problem.......everything displays perfecto except for that, so I don't want to go back through after all this work, and try to find the needle in a proverbial haystack. If you can point me in the correct general direction, I'd be so very grateful!

Thanks,
Kimberly