Как применить полосу прокрутки для нескольких div в главном div

Question

Я хочу применить полосу прокрутки для дочерних элементов div без прокрутки заголовка

Я пробовал

overflow-y:auto and overflow-y:scroll

, но ни один из них не работает

Мой основной divвысота 500px, и я даю высоту как 200px для моих дочерних элементов div, мне нужно применить прокрутку, если высота элемента div моего ребенка превышает 200px с фиксацией заголовков, которые не применяются с моим ниже css

<div style="padding:20px; max-height:500px;overflow-y:auto" id="divMain">
<div style="padding:20px; max-height:200px;overflow-y:auto" id="childdiv1">
</div>
<div style="padding:20px; max-height:200px;overflow-y:auto" id="childdiv2">
</div>
<div style="padding:20px; max-height:200px;overflow-y:auto" id="childdiv3">
</div>
<div style="padding:20px; max-height:200px;overflow-y:auto" id="childdiv4">
</div>
</div>

Answer 1

<div class="container">
<div class="col1" >
Mycontent 1
</div>
<div class="col2" >
Mycontent 2
</div>
</div>
.container {
    height: 300px;
    width: 35%;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
    padding-bottom: 30px;   
}

.col1 {
    height: 500px;
    width: 300px;
     position: relative;
    float: left;
}

.col2 {
    height: 500px;
    width: 300px;   
   position: relative;
   float:right;
}

enter code here