v4 navbar-fixed-top and modal-open padding-right content issue

[iatek]

In v4, when using a fixed navbar, content gets pushed to the far left when a modal is opened. It occurs when the body content extends beyond the viewport (vertical scrollbar), and is caused by the padding-right: 1617px; that's being added the body.

Perhaps the _isBodyOverflowing && isModalOverflowing test in modal.js needs to compensate for the fixed navbar?

http://codeply.com/go/W1PphRIdfs

[deilv]

I can't replicate, can you see how this is different?
http://codepen.io/deilv/pen/JYgoPV

[cvrebert]

I can reproduce some slight shifting within the iframe in the Codeply editor, but this doesn't reproduce when the page is top-level (i.e. not within an iframe).

[cvrebert]

This stops reproducing when I disable all the bullshit ::-webkit-scrollbar- styles on the iframe.

[cvrebert]

@iatek Also FYI there seem to be some "srollbar" typos in the editor CSS.

[cvrebert]

Ok, I can reproduce with http://plnkr.co/edit/3lfONeCUI7IsWTehp9pZ?p=preview after disabling autohiding scrollbars in OS X.

[cvrebert]

I suspect this is a duplicate of #14040, modulo the version.

[cvrebert]

_setScrollbar()'s code seems wrong to me.
I think that

`${bodyPadding + this._scrollbarWidth}px`

ought to use this._originalBodyPadding instead of bodyPadding.
And the compensation for position:fixed elements should be done on a per-element basis.

[deilv]

@cvrebert Your example works as intended on FF/Edge. Could this be Safari/OSX specific?

[cvrebert]

Perhaps. I only tested on OS X; it reproduces there in Chrome, Firefox, and Safari.

[deilv]

@cvrebert just for clarification, I am not talking about the slight shift of the navbar (I do see that and it's indeed a duplicate of #14040).
What I cannot see is the collapse of the content to the left. I did see it on the first codeply example, but nowhere else.

[deilv]

The Planker example works properly on iOS/Safari, will also check on my mac later.

[cvrebert]

The distance of the shift of content to the left that I observed in my example was small (~25px), not in the range of hundreds of px like OP said.

[deilv]

If you read the issue description you will realize this isn't the case. On the codeply example the content collapsed all the way to the left, not just a few pixels. I believe it's a problem with codeply, not bootstrap. The minor shift is a known issue, irrelevant to this one. IMO closure is in order.

[cvrebert]

Closing as probable duplicate of #17399.

[cvrebert]

Opened #18373 to track the "content shifts only slightly to the left" bug.