如何将我的YouTube视频放在同一行上？

我想将我的两个YouTube视频放在同一行。我尝试调整iframe并创建一个包装器，但它看起来并不像我瞄准正确的事情。我不确定我出错的地方。这里是我的JFiddle：https://jsfiddle.net/6a73m27n/如何将我的YouTube视频放在同一行上？

.content { 
 
    margin-top: 15px; 
 
} 
 

 
iframe { 
 
    float: left; 
 
}

<div class="video_wrapper"> 
 
    <iframe width="400" height="200" src="https://www.youtube.com/embed/3S_dmC2soik" frameborder="0" allowfullscreen></iframe> 
 
    <iframe width="400" height="300" src="https://www.youtube.com/embed/bdGhmMzj4uE" frameborder="0" allowfullscreen></iframe> 
 
</div>

来源

2016-05-13 dancemc15

我很抱歉，但我不知道你所说的“线”的意思。你想让他们堆叠在一起吗？ –

您的代码可以正常工作，只要确保它们都适合*在同一行上即可。你需要至少800px的宽度来包装来完成这个。 – Chris

如果你想要两个视频旁边的eachother（正好两个），你必须把'宽度：50％''iframe' –

只是提个视频的宽度，如下图所示：

<div class="video_wrapper"> 
 

 
<iframe width="40%" height="200" src="https://www.youtube.com/embed/3S_dmC2soik" frameborder="0" allowfullscreen></iframe> 
 
<iframe width="40%" height="200" src="https://www.youtube.com/embed/bdGhmMzj4uE" frameborder="0" allowfullscreen></iframe>

来源

2016-05-13 18:47:50

，如果您有它的实际工作足够的宽度为他们在一条线上。尽管如此，我建议你把这个造型的IFRAME，而不是：

iframe { 
    display: inline-block; 
    vertical-align: top; /* or middle, bottom, baseline by your preference */ 
}

来源

2016-05-13 18:51:04 Siavas

如何将我的YouTube视频放在同一行上？

回答

相关问题