Прокрутка фиксированной боковой панели, где генерируется динамическое содержимое

Question

У меня есть два столбца, левый столбец - основной канал, а правый столбец - боковая панель.

Я хочу прокрутить каждый столбец отдельно.

В этом случае хорошо работает левая прокрутка боли.

Однако правая прокрутка боли не работает.

Содержимое на правой панели динамически генерируется javascript, поэтому иногда оно становится длиннее экрана.

<div class="container" style="padding-top: 60px;" >

<div class="row">
    <div class="col-6 col-md-6 col-sm-6 col-xs-6">

    Main Feed

    </div>

    <div class="col-6 col-md-6 col-sm-6 col-xs-6" 
    style="overflow-y: auto;display: block;position:fixed;right:10px;">

    sidebar content this contents is generated dynamically by javascript

    </div>
</div>
</div>

Answer 1

<div class="col-6 col-md-6 col-sm-6 col-xs-6" 
     style="overflow-y: auto;
            display: block;
            max-height:100vh;
            right:10px;
            position: fixed;">
</div>

Проверка https://codepen.io/ashishkrtewari/pen/BaaJXWy

Я только что добавил сгенерированный контент и максимальную высоту 100vh. Без максимальной высоты вы не увидите полосу прокрутки, так как ничто не ограничивает высоту, чтобы показать полосу прокрутки.

Пожалуйста, отметьте