Сделать абсолютную высоту div 100%

Question

У меня есть родительский div с относительным положением и 2 дочерними div (слева и справа) с абсолютным позиционированием.

Осталось div должно быть height: 100% и править div Изменения в содержании динамически. Теперь, когда я прокручиваю левый ребенок, остается меньше (не 100%), а правый div имел свою высоту.

Существует горизонтальная навигационная панель сверху родительского div. Я пробовал с bottom: 0, position: fixed, но результаты не очень хорошие.

.left-sidebar { 
    font-weight: 400; 
    background-color: #B3E5FC; 
    display:inline-block; 
    width: 29%; 
    left: 0; 
    z-index: 2; 
    box-shadow: 5px 10px 10px 0px grey; 
    height: 92vh; 
    position: absolute; 
} 

.right-content{ 
    display: inline-block; 
    // height: 100%; 
    position: absolute; 
    left:0; 
    right: 0; 
    padding: 1em; 
    min-width: 66%; 
} 

.main-parent { 
    position: relative; 
} 

Answer 1

вам не нужно position:absolute, но вы должны дать height:100% к body/html и .main-parent

* { 
 
    box-sizing: border-box 
 
} 
 
body, 
 
html { 
 
    margin: 0; 
 
    height: 100% 
 
} 
 
.main-parent { 
 
    height:100% 
 
} 
 
.left-sidebar { 
 
    font-weight: 400; 
 
    background-color: #B3E5FC; 
 
    display: inline-block; 
 
    vertical-align:top; 
 
    width: 29%; 
 
    box-shadow: 5px 10px 10px 0px grey; 
 
    height: 100%; 
 
} 
 
.right-content { 
 
    display: inline-block; 
 
    height: 100%; 
 
    padding: 1em; 
 
    min-width: 66%; 
 
    background:red 
 
}

<div class="main-parent"> 
 
    <div class="left-sidebar">asda</div> 
 
    <div class="right-content">dsdf</div> 
 
</div>