Всем привет.
Есть модальное окно:
<div class="modal">
<div class="modal-form">
<div class="modal-close" data-modal-hidden="modal-form">
<svg class="icon icon-close "><use xlink:href="_img/svg/symbol/sprite.svg#close"></use></svg>
</div>
<div class="test" style="height: 2000px; background-color: #ffffff; width:"></div>
</div>
</div>
Стили модального окна:
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 6;
display: flex;
align-items: center;
justify-content: center;
visibility: collapse;
opacity: 0;
background-color: rgba(0, 0, 0, 0.6);
overflow: auto;
transition: all 0.5s ease;
}
.modal--is-show {
opacity: 1;
visibility: visible;
}
.modal-close {
position: absolute;
top: 0;
right: 0;
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
background-color: #204c96;
cursor: pointer;
transition: all 0.5s ease;
}
.modal-form {
position: relative;
margin: auto;
height: auto;
width: auto;
max-width: 1000px;
padding-right: 60px;
transition: all 0.5s ease;
animation: lightSpeedOut 0.5s ease;
animation-fill-mode: forwards;
align-items: center;
flex-direction: column;
justify-content: center;
display: none;
}
.modal-form--is-visible {
animation: lightSpeedIn 0.5s ease;
animation-fill-mode: forwards;
display: flex;
}
При открытии этого модального окна в Яндекс.Браузер или Google Chrome, у окна есть полоса прокрутки, но при прокрутки колесика мыши ничего не происходит, полоса на месте, форма на месте. Если изменить размер окна или через панель разработчика изменить какое нибудь значение стиля (добавить новое) окно начинается скролиться без каких либо проблем.
В мозиле такого нету, все идеально скролиться.
Кто нибудь сталкивался с такой или похожей проблемой ?
Как ее решить ?
Заранее спасибо