odd mozilla bug involving scrollbars

[phrozt]

I've been working on a site and noticed a problem with mozilla and spacing. When a page overflows the viewport, it creates the scrollbars on the side, which repositions everything on the page in firefox. I threw everything up on a dev server to look at real quick. Other than images and stuff.. it's fairly accurate:

http://www.senoformalwear.com/dev/weddings/

and

http://www.senoformalwear.com/dev/weddings/groomlist.php

as you can see, when going from weddings to the groomslist, everything gets pushed over about 2 pixels. I think it's actually the sitecontainer that gets pushed over. I gave the triplecontent a background color, and it was off the background by about 2 pixels like the rest of the page. That leads me to believe that the sitecontainer itself is not lining up correctly or something.

I've tried several things already, I was just wondering if I could get some input from other people as to how to solve this problem. Also, before anyone says anything, it's not the footAnchor tag that is pushing it over.. this problem existed before I put that in.

Any help is much appreciated.

 

[rpgfan3233]

You are right. The sitecontainer gets pushed over, and it is indeed because of the scrollbars, but also because you specified 100% width (I think). I tried giving middlecontent a height and specifying "overflow: auto" to create a scrolling div, but unfortunately it made it overlap the left navigation area when you hovered over the links.

I'm sure others have better ideas, however, so don't despair.

 

[KnotGoblin]

I've experienced a similar problem.

there are methods (some say hacks) for forcing the scroll bar with css.

i've used it before. It seemed to work nicely. its been a while since i've used it so i don't quite remember what it is, but if you google it i'm sure you can find several different ways to force the scroll bar.

I will post later what i used if i can find it.

-Jer

 

[Vragabond]

I don't really have time right now to go into details as to why these problems arise, however if you change #tripleContainer's width from 769px to 770px, the problem seems to go away -- the aspect of elements being jumbled when scrollbars are there. Ideally, this should not happen with the code you're using.

 

[phrozt]

yeah.. you're right.. it does go away.

I guess what I'll do is just adjust the rest of the page to include one more pixel of width.

I didn't think it should be happening w/the code that I'm using... I know I've done similar containers before where the sizing was not messed up when scrollbars came in to play.

And knotGoblin.. I know how to force scrollbars, but that's not a good visual choice of code. In order to always have scrollbars, I'd have to do overflow: scroll;. This would create horizontal and vertical scrollbars-the horizontal one completely negating the idea of floating a centered page. The other option is to do overflow-y: sroll; which will only put up vertical scrollbars. The problem with this is that they only appear with overflow... which puts me at the same disadvatage as I was before.

 

[phrozt]

oh and,

Thank you both for your input.

 

[phrozt]

actually.. this is really messed up. I had to delete one pixel on the background... so that it had the same image size, but so that it did not show up. Then I set the width of the triple container and the right container 1 pixel more for mozilla browsers....

weeird.