How to get additional images to align next to each other?

[JHouse]

Hi,

As you notice from this page:

http://209.67.53.167/~mbalo13/gunnardigitaloptiksattachemetropole-p-117.html

The additional images (sun glasses) below the main image are spread too far apart. How do I get them to sit right next to each other? They align fine when it's like 4 or more, but not 2.

Thanks in advance!

[tony_sar]

you can do the following . look for following rule in your CSS .

#productAdditionalImages {stylesheet.css (line 961)
float:left;
width:100%;
}

replace width from 100% to 300px .

#productAdditionalImages {stylesheet.css (line 961)
float:left;
width:300px;
}

or you may adjust the width as needed to suite your template

[JHouse]

you can do the following . look for following rule in your CSS .

#productAdditionalImages {stylesheet.css (line 961)
float:left;
width:100%;
}

replace width from 100% to 300px .

#productAdditionalImages {stylesheet.css (line 961)
float:left;
width:300px;
}

or you may adjust the width as needed to suite your template

Thanks for your help.

I was trying this approach before, however, it wouldn't work because I have other pages where the width needs to be wider to accommodate more images. I also tried using a min-width of 300px, but it wouldn't work. Any other ideas where the images will just line up right next to each other, as opposed to being spread out?

Thanks.

[tony_sar]

#productAdditionalImages {stylesheet.css (line 980)
float:left;
margin:0;
min-width:300px;
width:100%;
}

remove width:100%

min-width might not work with older IE browser.

[JHouse]

That did the trick. Much thanks Tony_Sar.

Have a good one!