左の列をナビゲータとして、右の列を本文にする方法は？

左の列をナビゲータとして、右の列を本文にする方法は？左の列をナビゲータとして、右の列を本文にする方法は？

<style> 
    #leftBodyVideo{ 
width: 45%; 
display: inline-block; 
} 

#rightBodyVideo{ 
width: 45%; 
display: inline-block; 
} 
</style> 

<div id="leftBodyVideo"> 
    <h5>Pyraminx ao12 16 46</h5> 
    <iframe width="560" height="315" src="https://www.youtube.com/embed/XDN9BXLFGhg" frameborder="0" allowfullscreen></iframe> 

</div> 

<div id="rightBodyVideo"> 
    <h5>Lubing DaYan ZhanChi Cube</h5> 
    <iframe width="560" height="315" src="https://www.youtube.com/embed/ydg0APsB7IU" frameborder="0" allowfullscreen></iframe> 

</div>

期待される結果は、この（ドキュメントテンプレート用）のようなものです：https://nodejs.org/docs/latest-v5.x/api/

出典

2017-04-26 YumYumYum

を追加します。ここで

FIDDLE

コードです：

div { 
 
    position: absolute; 
 
    left: 0; 
 
    top: 0; 
 
    bottom: 0; 
 
    overflow-y: scroll; 
 
    overflow-x: hidden; 
 
    height: 500px; 
 
    width: 200px; 
 
}

<div> 
 
    1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 1 
 
    <br/> 
 

 
</div>

出典

2017-04-26 05:09:19