Add to Cart, Quantity, Images Alignment -- Gone crazy. Please help!

[hindley]

Hi,

I have no idea how to fix the alignment of all my product page buttons! Add to Cart, Quantity, additional images, Attribute option, Tell A Friend, Write a Review.

Please have a look:
http://shop.chowkitkita.com/index.ph...products_id=86

I know I have to adjust my CSS but I have no idea where to start. Please help!

Thank you so very much!

[stevesh]

First, Zencart loads all stylesheets with the .css extension that it finds in the current template's css folder, so you have three sheets (stylesheet.css, stylesheet_ori.css and stylesheet ori2.css) fighting each other. Remove or change the extension name of two of them.

In one of those sheets, you have 20em of padding for #cartAdd. That's the bulk of your problem.

[hindley]

Thank you SO MUCH for your quick response, Stevesh!

I removed the other 2 confusing CSS files and now the page looks less crankier! Thanks!

There's still an alignment problem though.

1. How do I move the Attribute selection (Please choose a size:) right above the 'Add to Cart' button?
2. The Tell A Friend and Write a Review button is overlapping the bottom box (http://shop.chowkitkita.com/index.ph...products_id=71). How do I increase the margin?

Thanks again!

[hindley]

Hi again,

I managed to align my Attributes to the right by adding this to my CSS:

#productAttributes {
float:right;
}

But now, instead of being above the Add to Cart button, it is positioned side-by-side. How do I move 'Add to Cart' below? Please help. Thank you so much!

[hindley]

I solved the Add to Cart & Attributes side-by-side alignment problem.

Besides moving the <!--bof Attributes Module --><!--eof Attributes Module --> bulk above the Add To Cart BOF/EOF (in tpl_product_info_display.php) , I added

<br class="clearBoth" /> in the middle of the two bulks. This solved it.

But my 2. problem remains...

The Tell A Friend and Write a Review button is overlapping the bottom box (http://shop.chowkitkita.com/index.ph...products_id=71). How do I increase the margin?