Padding problem when there is a forced scrollbar
Created by: Michael-Ziluck
There is an issue with the way modals add margins to account for the scroll bar. This issue occurs in the most recent releases of both Bootstrap 3 and 4.
When a browser is forced to display the scrollbar when the vertical content does not require the scrollbar, a padding-right is added to the body when it is not necessary.
Two jsfiddle examples are below that show the problem.
Bootstrap 4: https://jsfiddle.net/ziluckmichael/fh71sgo0/
Bootstrap 3: https://jsfiddle.net/ziluckmichael/nvz0ybux/
As you can see it adds padding-right to the browser when it is not required. Both examples use the default code almost exactly as it is off of the demo page.
Browsers Always Affected:
- Microsoft Edge 40.15063.674.0
- Google Chrome 71.0.3578.98 (Official Build) (64-bit)
- Firefox 64.0.2
Browsers Sometimes Affected:
- Internet Explorer 11.1508.15063.0
For IE 11, the issue does not occur on my test/demo of the problem, but it does occur on the actual production website where I discovered the issue originally. It appears this is because IE overlays the scrollbar and has it slowly disappear, while every other browser has it permanently on the screen.