div, содержащий iframe и navbar, изменяет высоту только для navbar

Question

У меня есть div, который содержит расширяемое вертикальное меню слева, и iframe, содержимое которого изменяется в зависимости от выбора меню справа.

Проблема в том, что содержимое в iframe довольно большое, однако высота iframe идет только до меню. Если я раскрою меню, div и iframe тоже развернутся.

Что я могу сделать, чтобы div расширялся настолько, насколько это необходимо для iframe?

Я пробовал js-код, который, казалось, работал для кого-то другого, но он ничего не сделал для меня:

function resizeIFrameToFitContent( iFrame ) {
    			iFrame.width  = iFrame.contentWindow.document.body.scrollWidth;
    			iFrame.height = iFrame.contentWindow.document.body.scrollHeight;
    		}
    
    	window.addEventListener('DOMContentLoaded', function(e) {
    
    	var iFrame = document.getElementsByTagName('iframe')[0];
    	resizeIFrameToFitContent( iFrame );
    		} );

<div class="row containerWraper">
           <div class="col-sm-3" id="navContainer">
    		<ul class="nav flex-column">
    			<li>
    			  <a class="nav-link" href="content/intro/resources.html" target="content">Intro</a>
    			</li>
    			<li>
    			  <a class="nav-link" href="#" data-toggle="collapse" data-target="#tab1">tab1</a>
    			  <ul class="nav flex-column, collapse" id="tab1">
    				<li class="nav-item">
    					<a href="content/subtab1.html" target="content">subtab1</a>
    				</li>
    				<li class="nav-item">
    					<a href="content/subtab2.html" target="content">subtab2</a>
    				</li>			
    			  </ul>
    			</li>
                            <li>
    			  <a class="nav-link" href="#" data-toggle="collapse" data-target="#tab2">tab2</a>
    			  <ul class="nav flex-column, collapse" id="tab2">
    				<li class="nav-item">
    					<a href="content/subtab3.html" target="content">subtab3</a>
    				</li>
    				<li class="nav-item">
    					<a href="content/subtab4.html" target="content">subtab4</a>
    				</li>		
    			  </ul>
    			</li>
            </div>
            <div class="col-sm-9" id="iframeContainer">
    		       <iframe src="content/resources.html" name="content"></iframe>
    	</div>
    </div>