0

There are several blocks on the site that increase the height of the document, which causes the scrollbar to appear and the content shifts. I tried to fix it with CSS:

html {margin-right: calc( -1 * (100vw - 100%));}

But it didn't work at all.

Maybe the problem is bootstrap?

Codepen: https://codepen.io/pen/?template=abWOQdX

Psoriaz
  • 35
  • 4
  • `-1` what? -1 lenght of a banana, 1- lenght of an ant? `100vw - 100%` is what? 100% of what element? Also not, that you cant give a space for a scrollbar by default. The scrollbar width and lenght is depending on the UA. If you simply give a space for the scrollbar to appear, it will eb still rpesent if the scrollabr appears and as suchs till shift the content. – tacoshy Jul 03 '21 at 11:05
  • Hi, these kind of things really depend on the user's browser, i.e what they consider to be part of the view-port and what they don't. Similarly, different browsers also treat scrollbars differently. – Wali Waqar Jul 03 '21 at 11:15
  • Add `overflow-y: scroll;` to the body so the scrollbar track is always there so the contents don't shift when it needs to scroll – dantheman Jul 03 '21 at 11:41
  • Does this answer your question? [How to prevent scrollbar from repositioning web page?](https://stackoverflow.com/questions/1417934/how-to-prevent-scrollbar-from-repositioning-web-page) – piouson Mar 03 '22 at 20:19

0 Answers0