overflow-y: прокрутка; или overflow-y: auto; не работает

Question

У меня есть одна проблема с overflow-y:scroll; и overflow-y:auto;

Я создал этот в полноэкранном режиме DEMO и редактор экрана DEMO из codepen.io

В этой демонстрации при изменении ширины браузера изменение позиции столбца. Но если вы измените высоту браузера, прокрутка .ChWrP не сработает. Что мне здесь не хватает? Кто-нибудь может мне помочь в этом отношении?

<div class="ChWrP"> 
    <!--Left Sidebar STARTED--> 
    <div class="app-one"> 

    </div> 
    <!--Left Sidebar FINISHED--> 
    <!--Right sidebar STARTED--> 
    <div class="app-two"> 

    </div> 
    <!--Right Sidebar FINISHED--> 
</div> 

CSS

@media screen and (max-width:1210px) { 
    .ChWrP{ 
     flex-direction: column-reverse; 
     top: 0px; 
    height: calc(100% - 0px); 
    height: -webkit-calc(100% - 0px); 
    height: -moz-calc(100% - 0px); 
    overflow-y:auto; 
     overflow:hidden; 
    } 
    .ChWrP > div { 
     width: 100%; 
    } 
    .ocTppCT { 
    margin: auto; 
    width: 100%; 
    height: 100%; 
    max-width: 650px; 
    max-height: 67px; 
    color: #1B7BCF; 
} 
.txt { 
    background-color:rgba(0,0,0,.5); 
    border-radius:3px; 
    -webkit-border-radius:3px; 
    -moz-border-radius:3px; 
} 
span { 
    display:none; 
} 
    .app-one, .app-two { 
     min-height:500px; 
    } 
} 

Answer 1

Вы decalared на overflow свойство, придавая ему значение hidden, после объявляя overflow-y собственности. По каскадному характеру CSS свойство overflow-y будет переопределено.

Чтобы исправить это либо:

• Удалить overflow свойства полностью,
• Перемещение overflow свойства выше overflow-y собственности, или,
• изменить overflow свойство overflow-x.