Attribute images are stuck together !

I can't figure this one. I have a bunch of images and radio boxes where the the customer can choose the colour of a product. Looks great, the images are distributed evenly across the page (attribute style chosen is n° 4). I have added today another bunch of images but this time with check boxes so the customer can choose one or several accessories. Same attribute style as the radio boxes (n° 4). However, whereas the radio box images are nicely spread out across the page, the check box images are all stuck together producing a poor effect. Rather than add a white canvas to each image, is there way around this in zc ?

Cheers

Pete

Pete,
Please submit a link to the page in question!!

Here it is http://gardenserre.fr/index.php?main_page=product_info&cPath=1_4&products_id=8

Thanks for your help

Pete

Pete,
Add this class to your override folder ----> stylesheet.css

.attribImg {
padding: 0em 0.5em 0em 0.8em;
}

What happen with attributes images is by default the largest image overrides the layout for the whole page.
Because Couleur has smaller image you have associated 5 per row. Looks great but when you added Accessories with larger images they overlapped.

Great thanks. I know have a (minor) problem in that the last radio box attribute image is now pushed onto a second row ! Anyway around this ? Also, can I not align the check boxes so they sit on the baseline instead of being based on the length of the text ?

Cheers

Pete

Pete,
That image below the Accessories by itself is a seperate image called additional images you would half to remove the image from the stylesheet.css

1. This feature is disabled in the admin panel/ catalog/ product types/ Product - General
2. click on edit layout
3. click on Show Product Additional Images
4. set to 0
5. now the image will not appear

The radio & check box button page layout is the dimension of the largest image size.

1. Images in Couleur are 80px by 80px
2. Images in Accessories are 100px by 100px

So when I had you place the class from a previous post the Couleur last image #5 wraps to the next row.

1. Solution: recrop your Accessories images to 80px by 80px.

petek:

Also, can I not align the check boxes so they sit on the baseline instead of being based on the length of the text.

admin panel/ option name manager/ Couleur

1. click edit
2. Attribute Style for Radio Buttons/Checkbox
3. change to 4
4. update

This brings the checkbox on top of the image, then image, then wording.
Make a cleaner layout to view.

Do the same with Accessiores

admin panel/ option name manager/ Couleur

1. click edit
2. Attribute Style for Radio Buttons/Checkbox
3. change to 4
4. update

Thanks for your help. The answer obviously was to make all the attribute images the same size. Makes sense and produces the desired effect.

Cheers

Pete

Pete,
Thanks for your response back to see the problem was fixed.
Nice site, have a great Day!