Layout & Margins

[annettes]

Thank you very much!

[rbarbour]

np, glad I could help!

[jadedev]

I am new to all this. I am using AllBusiness template.

My web page.
http://www.chefscircle.com.au/cart/i...&products_id=1


I've moved the Product attribute from the left to the right with manipulating stylesheet.css.

#cartAdd {text-align: center;margin: 1em;border: 0px solid #000;padding: 1em;float:right;font-size:2.0em;}
#product-divider {border-bottom:1px dashed #ccc;}
.navNextPrevWrapper {text-align:center;}
.navNextPrevCounter {text-align:center;}
#productDescription {color:#888787;}
#productName {color:#68cbe2;font-weight:normal;font-size:2.0em;}
#productDetailsList {color:#888787;margin-top:10px;margin-bottom:10px;}
#productAttributes {margin:0% 0% 0% 67%; font-size:2.0em;}
#attribsOptionsText {font-weight:normal;color:#888787;}
.optionName {color:#68cbe2;margin-top:0px;}
#alsoPurchased {margin-top:20px;}

For the words "Please choose", I like that to be on a single line. Any idea how I do that?

Secondly, there's fair bit of white space between Size and Qty. How do i reduce it?

[rbarbour]

For the words "Please choose", I like that to be on a single line. Any idea how I do that?

in your stylesheet,

find:

#attribsOptionsText {font-weight:normal;color:#888787;}

change to:

#attribsOptionsText {font-weight:normal;color:#888787;width:200px !important;}

Secondly, there's fair bit of white space between Size and Qty. How do i reduce it?

You have 2 < br/>after the attributes, remove from your file /includes/templates/CUSTOM_TEMPLATE/templates/tpl_product_info_display.php file

Hope this helps!

[jadedev]

Thanks heaps, I've widen the text field and now it displays properly.

I tried looking for the <br/> but didn't have any luck. That's not too important.

I am more concerned that "Size" doesn't bottom align with the drop down box. is it possible to align it?

[rbarbour]

Look like you found those 2 <br /> so you can change:
in your stylesheet find:

#cartAdd {text-align: center;margin:1.0em;border: 0px solid #000;padding: 1em;float:right;font-size:2.0em;}

change to:

#cartAdd {text-align: center;margin:0em 1.0em 0em 0em;border: 0px  solid #000;padding: 1em;float:right;font-size:2.0em;}

then to vertical align attrib name find:

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

change to:

LABEL {line-height: 1.5em;padding: 0.2em;}

Hope this helps!

[jadedev]

It worked, yipee. Many thanks mate.

[rbarbour]

np, glad I could help!

[jadedev]

This one really confused me. I can't seemed to find the php template and therefore not too sure which attribute to tweak in the .css file


I want to move the words "best jacket ever" to under the price and align with the price.

Then "more info" below everything and left aligh with price.

http://www.chefscircle.com.au/cart/i...e=products_all

[rbarbour]

You can change the layout of your all products listing page by going to:

ADMIN > CONFIGURATION >ALL LISTING

and change the value to re-arrange.

Hope this helps!