Products Layout

[rstevenson]

... However, If you want every other row to be staggered like in your screen shot, that will take a bit more work and some php code editing. Basically you will need the php code to generate 2 separate class selectors assigned to every other div. Hope you have enough php knowledge because this can become tricky.
And then assign some style for example:
.div1 img {
float: right;
border-left: 2px solid brown;
}
.div2 img {
float: left;
border-right: 2px solid brown;
}

Actually the Zen Cart code already contains classes for doing this. They're not in the stylesheet, but there's lots of classes that are not in the stylesheet but ready for use in the code if you need them. So add these two elements to your stylesheet.css and edit as suggested above.

.productListing-odd { }
.productListing-even { }

I use them for setting an alternate colour for each row, but I'm going to look into doing something similar to what you're trying to do. I like that look a lot.

Rob

[Nick1973]

Actually the Zen Cart code already contains classes for doing this. They're not in the stylesheet, but there's lots of classes that are not in the stylesheet but ready for use in the code if you need them. So add these two elements to your stylesheet.css and edit as suggested above.

.productListing-odd { }
.productListing-even { }

I use them for setting an alternate colour for each row, but I'm going to look into doing something similar to what you're trying to do. I like that look a lot.

Rob

Go for it Rob, I'd already worked out the classes and have managed to do this anyway. The bit I'm struggling with is the actual layouts of the product listings. Not so much the background of them.

Thanks Though

Nick

[jwitt98]

Nick,
Please ignore what I said in my first post.
I was thinking you were referring to the products listings on the main page, shopping cart page etc. where the featured products, new products etc. are listed. Those are laid out using divs and css.

It's obvious to me now that you are trying to change the layout of the actual products listing page. That page is laid out using tables.

Sorry, my bad. I should have read your post more clearly. What the others are saying seems to be the route to go.