Product image layout in centrebox - this must be easy?

[4lex]

Hello all. I'm struggling with trying to centre the two column layout of products I have in the centrebox, using ZC 1.3.9h and the classic template. As it stands they're left justified, I just want them in the middle!

I'm thinking it must be this part of the stylesheet:

/*The main content classes*/
#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, 

.categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, 

.centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
	vertical-align: top;
	}
/*.content,*/ #productDescription, .shippingEstimatorWrapper {
	/*font-size: 1.2em;*/
	padding: 0.5em;
	}

but having tried various stuff like "horizontal-align: center;" I'm not making progress

Appreciate any help :)

Alex

[stevesh]

In a stock Zencart installation, they are centered (if I understand the question). (see www .stevesh.org) Can you provide a link to your site ?

[4lex]

I don't want it visible just yet, please excuse my not linking it.
Cleansun dot co dot uk slash shop
Thanks for your help :)

[eentje]

If you are talking about the images being left... try adding:

.centerBoxContentsNew img {
margin-left: auto;
margin-right: auto;
}

to your stylesheet

[stevesh]

Ah, the New Products listing.

Add something like this to the bottom of your stylesheet:

.centerBoxContentsNew img {margin: auto;}

A couple of hints:

Stop everything and create your custom template and move the files you've edited already into those folders. You'll lose everything at your next upgrade if you use the Classic template.

Your product images are waaaay too big (file size, not dimensions, though they're a little big that way, too) and your site loads very slowly as a result. Rule of thumb is that the main (smallest version) of the product image be <10kb.

[4lex]

thank you both, will try shortly. Yes, aware that the images are too big, i'm intending to re size them all prior to launch.

[4lex]

.centerBoxContentsNew img {margin: auto;}

worked a charm, many thanks.

I thought about the custom template thing briefly, and then thought I didn't want to upgrade anyway. I think you're right though, I should do it right. Going off in search of a guide to creating a custom template now.

Thanks again for your help.