Меню Nav смещается вправо, когда отображается модальное всплывающее окно начальной загрузки
Когда модальное всплывающее окно, правая прокрутка исчезла, основной контекст не двигался - это нормально, но навигационное меню смещается вправо, заполняя пространство прокрутки. Затем, когда я закрываюсь, появляется всплывающая прокрутка и меню смещается назад. Есть идеи, как предотвратить смещение меню? Использование Bootstrap v3.3.1
Вот так выглядит мое меню:
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/" id="navbar-brand">MySite</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="home">
<a href="/" class="btn_main"><i class="fa fa-home" title="home"></i></a>
</li>
<li><a href="/contact">About</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="/account/login" id="loginLink">Login</a></li>
</ul>
</div>
</div>
вот мое модальное всплывающее окно:
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="exampleModalLabel">Title</h4>
</div>
<div class="modal-body">
<form name="form-contact" id="form-contact" class="form-validation">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter your email" ng-model="contact.email" required="">
</div>
<div class="form-group hide">
<textarea class="form-control" rows="6" placeholder="Type your message"></textarea>
</div>
<input type="submit" id="submit-form" class="hidden">
</form>
</div>
<div class="modal-footer">
<label for="submit-form" class="btn btn-warning font-bold">Click!</label>
</div>
</div>
</div>
ОБНОВЛЕНИЕ Я только что нашел исправление здесь https://github.com/twbs/bootstrap/issues/14040
.modal-open .navbar-fixed-top,
.modal-open .navbar-fixed-bottom {
padding-right: 17px;
}
Означает ли это, что это ошибка в начальной загрузке?
ОБНОВЛЕНИЕ 2 Вышеуказанное поведение применяется ко всем последним браузерам на основе WebKit, но только что проверил IE 12 и там вся страница смещается вправо, когда появляется модальное.