Standards compliance

O método "single-object" codifica os "es" comerciais (ampersands) nos URL's usando uma solução inspirada no método de aninhamento de objetos (“nested-objects”) - neste caso reduzindo-o a um único objeto - "single-object".

CSS

#containingBlock {
  width:50%;
}
.video-conteudo {
  position: relative;
  padding-bottom:56.25%;
  padding-top:25px;
  height:0;
}
* html .video-conteudo {
  margin-bottom: 45px;
  margin-bot\tom: 0;
}
.video-conteudo div,
.video-conteudo object {
  position:absolute;
  top:0;
  left:0;
  width: 100%;
  height:100%;
}

Markup

<div id="containingBlock"> 
<div class="video-conteudo">
<div> 
<!--[if IE]>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="480" height="295">
<param name="movie" value="http://www.youtube.com/v/K42zcoOwGaY&hl=pt-br&fs=1&" />
<![endif]-->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/K42zcoOwGaY&hl=pt-br&fs=1&" width="480" height="295">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<p><a href="http://www.adobe.com/go/getflashplayer"><img alt="Get Adobe Flash player" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"/></a></p>

</object>
</div>
</div>

Utilizamos o método "single-object"

CSS

Markup