Responsive div class - html

Question

I'm trying to make my website responsive and I have already set the divs' min-height and set the display: inline-block. I already did it to one of the div but then when I tried to make it on the others, it just maintained its min-height. I can see the words adjust when I tried it out but the size/height of the div stayed the same. I think it's because the positions of the divs are in absolute but I also tried to set it to relative, but then the design messed up.
.fullbanner2 {
width: 95.2%;
min-height: 90vh;
}
.banner2left, .banner2right {
position: absolute;
display: inline-block;
min-height: 90vh;
overflow: hidden;
}
.banner2left {
width: 52%;
height: 90vh;
background: #FFFFFF;
letter-spacing: 2px;
}
.banner2left h1 {
font-size: 75px;
margin-top: 7.5%;
margin-left: 4%;
margin-right: 1.5%;
color: #333333;
font-family: 'Athena', sans-serif;
}
.banner2left p {
font-size: 25px;
margin-top: -2%;
margin-left: 4%;
color: #666695;
}
.banner2right {
background: url(../colors-n-pics/picture2.jpg) no-repeat 50% 50%;
margin-left: 52%;
background-size: cover;
width: 43.2%;
height: 90vh;
}
<div class="fullbanner2">
<div class="banner2left">
<h1>Lorem ipsum</h1>
<p>Curabitur congue non diam id venenatis. Ut eget dolor dictum, iaculis lacus quis, commodo justo.</p>
</div>
<div class="banner2right">
</div>
</div>
<div class="statement1">
<h2><center>Curabitur dolor erat, accumsan in elit vitae. Curabitur dolor erat, accumsan in elit vitae, finibus malesuada erat. Ut nibh enim, mollis vitae diam non, placerat fringilla nulla. Proin elementum, lectus sed mollis convallis. </h2>
</div>