Preventing Page Shift to left in Safari and Firefox
My home page has a lot of columns – the less important ones are usually beyond the right edge of the page in a small screen. In Safari and Firefox that creates an unpleasant page “jump” or shift to the left when the page first loads. Instead of seeing the navbar and main articles, the page shifts so the content on the far right is within the page.
I found a cure for this behavior here: Getting Rid of the Page Shift
Adding this to the style sheet fixed it:
/*this is to keep page from shifting to left on load in safari and firefox*/
html { min-height: 100%; margin-bottom: 1px; }
html { overflow: -moz-scrollbars-vertical !important; }
FANTASTIC! I was literally about to pull some hair out until i found this. Thank you!
Thanks a lot It’s works
This is exactly the thing I needed. I wondered why in the world my pages jump around in Firefox. A quick Google search took me right to your fix. I still don’t know why, but they don’t jump anymore. Thanks!!!!
You could just use this:
html, body { height:100.1%; } which will force a scroll bar.
The proprietary Mozilla css you’ve quoted is really intended for use in Firefox’s internal rendering stylesheet in order to force the behaviour permanently within a copy of the browser. By using it in an external website sheet as you’re suggesting, you’re basically doing the same thing twice (for FF only) for no reason.
Saved a lot of time searching for this answer, thank you!!!
Thanks for the help. I had this same problem, did a search on Google and this helpful hint showed up and worked.
Thanks loads.
Thanks!
Thanks for this, it was driving me crazy, it works in firefox and IE7 ..IE8 however wont do it. but im not gonna worry about that… thanks again
Sweet!!! Thank you so much!!!!
wow! it actually worked!!! Thank you !!! 🙂
Top stuff. Was wracking my brains and going over and over through my CSS thinking I done something wrong in the code! This solved the issue! Glad I googled it – has saved a lot of time and frustration!
I love you…..owen
Ok I got that but now where in the word do I insert this?
Worked like a charm. Thanks so much for posting.
Thanks so much, it actually fixed in for me in Opera!!
So where do I place this code?
In the CSS style sheet.
Thanks for the post! The solution worked like charm!
Works fine except in IE8. Any solutions or IE8?
Thanks for the good info!
But this does not fix the page shift from occurring in Safari (4.0.5) only in Firefox.
Is there a fix for Safari as well?
You’re awesome! I used it and it worked.
my website has jump still in safari 5.1 when from a page go to another page.how do i solve it?i use that code in css but it dont work for meeeee!!!!
what do i do?pls help me
ABSOLUTELY PERFECT!!! Thank you SOOOO MUCH!!!
Thank you so much. You saved my day!
—–