Здравствуйте, у модального окна появляется полоска скролла, но самого скролла нету.
Справа скролл самого сайта.
Вот html:
<div id="my_modal" class="modal">
<div class="modal_content">
<span class="close_modal_window">×</span>
<p>Нарезное пирожное «Сникерс»</p>
<div class="modalImg d-flex justify-content-between">
<div class="imgwrip">
<img src="img/i1.jpg" alt="">
</div>
<div class="descript">
<div class="p">
<p>«Сникерс» - бисквит шоколадный, креме шоколадное, мусс на основе нуги с арахисом, мягкая Карамель без желатина, жареный арахис, глазурь. </p>
</div>
<div class="butBuy d-xl-flex d-lg-flex d-md-block d-sm-block d-block justify-content-around">
<div class="one">
<p>Видеоурок + технологическая карта</p>
<h3>2 500 руб.</h3>
<a id="nu">Начать изучение</a>
</div>
<div class="two">
<p>Технологическая карта</p>
<h3>1 500 руб.</h3>
<a id="nuni">Начать изучение</a>
</div>
</div>
</div>
</div>
</div>
</div>
.modal {
display: none;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.6);
z-index: 1000; }
.modal .modal_content {
background-color: #fefefe;
margin: 1rem auto;
padding: 20px;
border: 1px solid #888;
width: 99%;
z-index: 99999;
overflow-y: scroll;
height: 1000px; }
.modal .modal_content .modalImg {
margin-top: 30px; }
.modal .modal_content .modalImg .descript .p p {
font-size: 18px;
font-weight: 600; }
.modal .modal_content img {
width: 300px;
margin-right: 50px; }
.modal .modal_content .butBuy {
margin-top: 50px; }
.modal .modal_content .butBuy .one {
text-align: center; }
.modal .modal_content .butBuy .one p {
font-size: 18px;
font-weight: 600;
margin-bottom: 20px !important; }
.modal .modal_content .butBuy .one h3 {
margin-bottom: 30px; }
.modal .modal_content .butBuy .one a {
background: #FE4646;
padding: 10px 30px;
border-radius: 10px;
color: white;
font-size: 18px;
font-weight: 700;
text-decoration: none; }
.modal .modal_content .butBuy .one a:hover {
-webkit-transition: all ease 0.2s;
-o-transition: all ease 0.2s;
transition: all ease 0.2s;
border: 2px solid #FE4646;
background: none;
text-decoration: none;
color: #FE4646; }
.modal .modal_content .butBuy .one a:not(:hover) {
-webkit-transition: all ease 0.2s;
-o-transition: all ease 0.2s;
transition: all ease 0.2s;
border: none;
background: #FE4646;
text-decoration: none;
color: white; }
.modal .modal_content .butBuy .two {
text-align: center; }
.modal .modal_content .butBuy .two p {
font-size: 18px;
font-weight: 600;
margin-bottom: 20px !important; }
.modal .modal_content .butBuy .two h3 {
margin-bottom: 30px; }
.modal .modal_content .butBuy .two a {
background: #FE4646;
padding: 10px 30px;
border-radius: 10px;
color: white;
font-size: 18px;
font-weight: 700;
text-decoration: none; }
.modal .modal_content .butBuy .two a:hover {
-webkit-transition: all ease 0.2s;
-o-transition: all ease 0.2s;
transition: all ease 0.2s;
border: 2px solid #FE4646;
background: none;
text-decoration: none;
color: #FE4646; }
.modal .modal_content .butBuy .two a:not(:hover) {
-webkit-transition: all ease 0.2s;
-o-transition: all ease 0.2s;
transition: all ease 0.2s;
border: none;
background: #FE4646;
text-decoration: none;
color: white; }
.modal .modal_content .close_modal_window {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer; }
Если, что сайт на bootstrap 4, но использовать бутстраповские модальные окна не хочу.
Простой
