By baronmunchowsen on

Hi,

I'm scratching my head trying to figure out why a horizontal scrollbar is appearing on this page (the homepage) in Mozilla on the PC it effects only the homepage, and doesn't affect any other browser (even IE6!). There seems to be an extra 100px of width added to the right of the page.

http://www.whistlerguides.com

Very strange and any help much appreciated.

⋅ Categories: Drupal 5.x

Comments

TapocoL’s picture

TapocoL commented

.front-page #navlist in style.css has width of 880px that looks to be causing this problem. You should be able to just get rid of the width style and it will display properly. I recommend still testing on other browsers to make sure there aren't other problems. Use Firebug for future web developing problems.

-Craig Jackson
-Web Developer

Anonymous’s picture

Anonymous (not verified) commented

Beautiful website.

Just a small point if I may. From a usability standpoint the navigation doesn't show up on 1024 resolution. I had no clue there was a menu beneath the (beautiful) pictures.

Gooitzen van der Ent
Design
http://www.coolgrafimedia.com

baronmunchowsen’s picture

baronmunchowsen commented

Hi,

Thanks for your comments. Hopefully you can see the red menu bar over the top of the images? We will look at resizing the images more perhaps.

Thanks,

baronmunchowsen’s picture

baronmunchowsen commented

Hi There,

I added the width to .front-page #navlist in an effort to remove the extra scrolling with no luck. I have removed this now and as you will see I still have the problems.

I have firebug switched on, but can't see anything obvious - what should I be looking for?

Thanks for your help.

zeta ζ’s picture

zeta ζ commented

Remove the left property and add text-align. You might also want a margin-right.

.front-page #navlist {    style.css (line 86)
  font-size:110%;
  font-weight:bold;
--left:256px;
  position:relative;
  text-align:right;
  top:235px;
  z-index:99;
}

___________________
It’s in the detaιls…

Anonymous’s picture

Anonymous (not verified) commented

.front-page #navlist {
font-size:110%;
font-weight:bold;
left:0px;
position:relative;
top:235px;
z-index:99;
}

Changing the "left" property to "0" gets rids of the scrollbar in Firefox.

Hopefully you can see the red menu bar over the top of the images?

On the first page I see a bar. Is that what you mean?

On the second page the .jpg with contact info has .jpg fuzz (compromised too much.)
The red crosses in the left-menu are confusing as they show when the menu is opened

Otherwise: love the site.

Edit:
zeta-zoo: My bad just saw we were talking about the same thing.

TapocoL’s picture

TapocoL commented

I do agree with the site, very nicely done. Anyway, use margin-left instead of left. I made this change in firebug and it has fixed it on my browser, but deletion of width also fixed it in my browser. So, let me know if that fixes it or not.

-Craig Jackson
-Web Developer

anil_shinde’s picture

anil_shinde commented

body{ width:1003px; overflow-x: hidden;}
//width as u want ..will remove horizontal scroll bar

baronmunchowsen’s picture

baronmunchowsen commented

Thanks very much for your feedback and help.
I have removed the 'left' value and added a margin-right (though the margin-left worked just as well).

I was truly stumped on this and I thank you all very much for helping me out.