Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / How to get additional images to align next to each other?

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

Locked

Views: 3,612

Results 1 to 5 of 5
This thread is locked. New replies are disabled.
1 Jul 2009, 7:00 AM
#1
jhouse avatar

jhouse

Zen Follower

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

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

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!

2 Jul 2009, 9:46 PM
#2
tony_sar avatar

tony_sar

Totally Zenned

Join Date:
Jul 2006
Location:
Montreal, Canada
Posts:
2,276
Plugin Contributions:
0

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

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

5 Jul 2009, 7:48 PM
#3
jhouse avatar

jhouse

Zen Follower

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

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

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

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.

6 Jul 2009, 8:45 AM
#4
tony_sar avatar

tony_sar

Totally Zenned

Join Date:
Jul 2006
Location:
Montreal, Canada
Posts:
2,276
Plugin Contributions:
0

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

#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.

6 Jul 2009, 6:27 PM
#5
jhouse avatar

jhouse

Zen Follower

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

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

That did the trick. Much thanks Tony_Sar.

Have a good one!