开发者

Alternative To body {overflow:scroll;} That Will Prevent Page Jostling/Wriggling?

开发者 https://www.devze.com 2023-02-10 22:16 出处:网络
I was pulling my hair out for about 30 minutes trying to figure out why my webpage was shifting a few pixels when I was navigating between pages. I finally realized that it was because the right scrol

I was pulling my hair out for about 30 minutes trying to figure out why my webpage was shifting a few pixels when I was navigating between pages. I finally realized that it was because the right scroll bar, on the longer pages, was popping up and shifting stuff over.

I found a solution that goes as follows.

body{
    overflow: scroll;
}

This forces every page to 开发者_高级运维have a scroll bar, so the appearance/disappearance of the scroll bar does not jostle the elements of the page back and forth a few pixels as you navigate through the site.

Is there a better way to accomplish what I want without rendering a useless scroll bar on the right side? I imagine you could offset the pages that don't have very long content a few pixels to compensate, but then it seems like you'd have to keep track of which pages are a certain length, and switch around their CSS depending on how much content they have which would be awfully annoying.

Thanks for any advice :)


Sadly, i think that forcing scrollbar to show is the only way to avoid page shifting... just try only "overflow-y" as you dont need horizintal scrollbars

0

精彩评论

暂无评论...
验证码 换一张
取 消