Components, Choices & CSS

[magicalwonders]

I've just started work entering some products that
involve "attributes", "components" and "Choices". What a nightmare! One page in the manual and a flow chart just doesn't cut it!

Anyway, I've taken a break from what I really wanted to do and have included a product that has five choices of colour. (No components required)

I've had to create a new layout for this as my "compact" layout was getting broken and looking messy.

The problem I have is that the "drop down box" and the "buy" button is sticking to the right hand side like glue. You can see the result here.. http://www.magicalwonders.com/acatal...umables2.shtml

It's the last item on the page, and I've left borders on for this layout.

I have tried adding a class to the style sheet:

.variablepad {
	padding-right: 10px;
	}

But I'm obviously not referencing it properly in the html. I'm getting that Deja Vu feeling.

I've tried including the class in the cell that contains the "buy" button. I've applied <span> etc, but nothing seems to work for me.

I can get it to shift with cellpadding - but that of course affects the rest of the cell.

At the moment, the above url page does not have my new class specified. I can't think where else to put it!

Can anybody suggest how I can fix this?

Many thanks,

Myles

[peblaco]

Try: <td colspan="2" align="right" valign="top" class="variablepad">

[DarrenSpink]

Its not clear what you are trying to do, is it to basically add some padding to the the right hand side of the box?

Ypu could change the td in the table from:

<TD align="right" colspan=2 valign="top" >

to

<TD colspan=2 valign="top" class="variablepad">

then adjust the class in your style sheet to whatever you require

sorry if im repeating what you already know or have tried!

Darren

[magicalwonders]

Thanks Louise & Darren,

<TD colspan=2 valign="top" class="variablepad">

I had tried this last night and couldn't get it to work. I must have had a typo 'cause it works fine now! "aaaaaaaaaaagh!"

On a side note... Is there any way to get the "Add to cart" button to appear on the same line and to the right of the drop down box?

I've had a look in the following templates: Act_VariantAttributeName.html
Act_VariantListHeader.html Act_VariantListChoice.html
Act_VariantListFooter.html Act_CartButton.html but can't find any <br> or code that is controlling this.

Many thanks,

Myles

[peblaco]

It's paragraph tags need removing.

[magicalwonders]

Thanks Louise,

That works great. I've added in a couple of &nbsp; and got everything just where I want!

Many thanks,

Myles