Forums / Templates, Stylesheets, Page Layout / Want to have options on the same line (size and color)

Want to have options on the same line (size and color)

Locked

Started by jhouse on 30 Mar 2010, 6:23 PM · Views: 920

Results 1 to 6 of 6
This thread is locked. New replies are disabled.
30 Mar 2010, 6:23 PM
#1
jhouse avatar

jhouse

Zen Follower

Join Date:
Dec 2006
Posts:
132
Plugin Contributions:
0

Want to have options on the same line (size and color)

Hi there,

Could you please help me with these two issues:

  1. I want to put the Color and Size option on the same line. Currently it looks like this:

http://www.landofakes.com/dethray-tshirt-p-48.html

and I want it to layout like this:

http://www.landofakes.com/images/LF_Add_to_Cart.jpg

  1. It would be great to get the Qty box and the "Add to Cart" image to line up properly (the Add to Cart image is too high up and thus isn't flush with the Qty field). Ideally, I want it to layout like the link just above.

Any ideas?

Much thanks!!!

30 Mar 2010, 6:44 PM
#2
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,874
Plugin Contributions:
8

Re: Want to have options on the same line (size and color)

In your stylesheet, find.wrapperAttribsOptions { margin: 0.3em 0em; }and add to get```
.wrapperAttribsOptions {
margin: 0.3em 0em;
float: left;
}

#cartAdd input+input+input {
position: relative;
bottom: -0.5em;
}

30 Mar 2010, 7:37 PM
#3
autoace avatar

autoace

Totally Zenned

Join Date:
Jun 2009
Posts:
618
Plugin Contributions:
0

Re: Want to have options on the same line (size and color)

Thanks Glenn, worked great for me!

Do you know how to increase the height of the Qty box?

Thank you,
autoace

30 Mar 2010, 8:03 PM
#5
jhouse avatar

jhouse

Zen Follower

Join Date:
Dec 2006
Posts:
132
Plugin Contributions:
0

Re: Want to have options on the same line (size and color)

Yes, thank you Glenn, that worked for me too. Awesome!!!

It looked perfect in Chrome, but not in IE 7, so I messed with this part:

bottom: -0.5em;

and changed it to:

bottom: -3px;

Now it looks tight in IE7, but not Chrome. Any thoughts?

PS - I tried using em sizes first, but then went with px.

Thanks again for your help.

1 Apr 2010, 3:15 PM
#6
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,874
Plugin Contributions:
8

Re: Want to have options on the same line (size and color)

It might just be a case where browsers handle things differently, and you need a browser-specific stylesheet to handle it for IE.