Bootstrap Modals keep adding padding-right to body after closed

Question

I am using bootstrap and Parse framework to build a small webapp. But those Bootstrap modals keep adding padding-right to body after closed. How to solve this?

I tri

Answer 1

A pure css solution that keeps the bootstrap functionality as it should be.

body:not(.modal-open){
  padding-right: 0px !important;
}

The problem is caused by a function in the bootstrap jQuery that adds a bit of padding-right when a modal window opens, if there is a scroll bar on the page. That stops your body content shifting around when the modal opens, and it's a nice feature. But it's causing this bug.

A lot of the other solutions given here break that feature, and make your content shift slightly about when the modal opens. This solution will preserve the feature of the bootstrap modal not shifting content around, but fix the bug.