テキストとビデオを並べて表示する方法（HTML Webページ）

Question

左側にテキストが、右側に埋め込まれたYouTubeビデオが作成されました。

しかし、ビデオは高さが伸びています。

この私が

<br> 
 
<div class="col-md-6"> 
 
<h3> <strong> Heading </strong > </h3> 
 

 
<hr> 
 

 
<h3 class="null"><i class="fa fa-check" aria-hidden="true"></i> &nbsp; Text blurb here </h3> 
 
<h3 class="null"><i class="fa fa-check" aria-hidden="true"></i> &nbsp; Text blurb here</h3> 
 
<h3 class="null"><i class="fa fa-check" aria-hidden="true"></i> &nbsp; Text blurb here</h3> 
 
<h3 class="null"><i class="fa fa-check" aria-hidden="true"></i> &nbsp; Text blurb here</h3> 
 
<h3 class="null"><i class="fa fa-check" aria-hidden="true"></i> &nbsp; Text blurb here </h3> 
 

 
<hr> 
 
<h3> <strong> Some text here as well </strong> 
 
<h4> some more text here too </h4><br> 
 
</div> 
 

 
<div class="col-md-6"> 
 
<iframe width="560" height="315" src="https://www.youtube.com/embed/C0DPdy98e4c?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe> 
 
</div> 
 

 
<div class="clear"></div>

を使用していたコードは、どのようにして高さを伸ばすない映像を得ることができています。

Answer 1

<video width="320" height="240" controls> 
    <source src="movie.mp4" type="video/mp4"> 
    <source src="movie.ogg" type="video/ogg"> 
</video> 

Think this will help you dude .... 

http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video_width_height 

Answer 2

ただ、ここでは、ブートストラップのdiv

<div class="col-md-6"> 
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/C0DPdy98e4c?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe> 
</div> 

を埋めるために、幅と= 100％のiframe内の高さを作ることのjsfiddleです：https://jsfiddle.net/97pd8Lsh/