使用Box-shadow和嵌入的YouTube播放器时遇到问题

Question

我想在我的YouTube嵌入下显示投影，并且当我使用不同大小的视频时遇到问题。当我将静态div包裹在它上面时，我可以使它工作，但对于不同大小的视频不适用。如果有帮助，它们总是具有相同的宽度（640px），高度取决于相机/视频。

有没有更好的方法来做到这一点，也许可能应用到iframe？我是CSS的noob，我似乎无法在网上找到答案。

任何想法？

我的代码：
HTML：

<div id="videoclip"> 
<iframe width="640" height="510" src="http://www.youtube.com/embed/l4hMvo71p4M?rel=0&wmode=transparent&showinfo=0&start=11" frameborder="0" allowfullscreen></iframe> 
</div> 

CSS：

#videoclip{ 
width: 640px; 
height: 510px; 
box-shadow: 5px 5px #818181; 
-webkit-box-shadow: 5px 5px 5px #818181; 
-moz-box-shadow: 5px 5px 5px #818181; 
} 

Answer 1

使用float: left而不是width: 640px; height: 510px;。它会让div拥抱它的孩子。你可以看到它拨弄here。

直接应用于框架也works。