Horizontal Scroll Bar on Product Listings

Hi,

Does anyone know why I'm getting a horizontal scroll bar on my product pages?

What's setting the width on these pages that it needs to scroll past the main wrapper width?

I see a combination of things:
body{ has a left & right margin of 15px
#mainWrapper { has a width of 1020px and border of 1px
#imgFixOffer { even though absolutely positioned, takes up space in the window because it extends farther than the header.

Your page even without this would require 1052px plus the window trim, so would force a scrollbar on any 1024x768 monitor.

Hi Glenn,

But my display settings are at 1920x1200 and I still see horizontal scroll bar?

I only see it on product listings, nowhere else, even though all pages on the site are the same width, taken from the combination of things outlined above?

When I set my monitor to 1280x1024, I don't get the scrollbar. I can't tell why you would be seeing it.

It's only on product pages. Example:

http://www.limelites.co.uk/index.php?main_page=product_info&cPath=1_24&products_id=409

I'm viewing FF but all browsers show it for me.

I'm looking at it in Firebug and I see multipart/form-data causing some strange width issues... Are you familiar with this at all?

I see the issue on the product info page - something is making that maybe 1800px wide.
I'm not sure whether the form is the cause or a symptom. When I change the form's display from inline to block (in Firebug), the blue hover patch moves from extending to the right edge of the window back to inside the page wrapper; but the total space still doesn't shrink.

PS - you said you saw the problem on product listings, which misled me - it doesn't appear on listings but on product info pages.

Sorry for the terminology. I keep getting confused between product info page and product listing page...

On the product 'info' page, something is indeed making the page about 1800px;

If I set the form to display: block; then it does go narrower and it pushes the description on the wider products onto a new line. Example:

http://www.limelites.co.uk/index.php?main_page=product_info&cPath=1_6&products_id=136

Moreover, the horizontal scroll still doesn't go away :-)

is your form tag that is that effecting this .. either is inheriting any style from some where or is just template problem ..

add this to your style . and test your site to make sure everything works ok

form {
float:left;
}

Hi Tony,

Thanks for the reply. I added the

form {
float:left;
}

to my site and as soon as I refresh, the description hops onto a new line and still, the horizontal scroll bar is there.

You have this in your page source...

the div is pushed over to the right by 635px and causing the horizontal scroll bar...

I'm not sure which template file you have inserted the above, but try;

Good catch!

Better yet, give the div an id and style the id in the stylesheet, instead of in the PHP file.

Perfect Steve, that was exactly the cause. Adding the 180px width sorted it right out. Thank you :hug:

Thanks Glen for the advice. I know I should have this styled in the stylesheet :-)

Hi, I am very new to zen cart and am having a similar problem but cant find any way to fix it. Please can you have a look ?
This is my site
http://www.ladybirdlessons.com/index.php?main_page=
Thank-you
Frances

Your logo is 1077 pixels wide, and you have 15 pixels of padding on its left, so your site can't be less than 1092 pixels wide.

You need to make your logo small enough to fit in the minimum width of your site (1000px), allowing for any padding/margins.

Thanks for the help - I have reduced it now to 90 but it is still showing a scrollbar a little. I will reduce it more but beginning to look funny on my laptop now.