YouTube video

Ratio:

16:9

Chrome:

25px

Yahoo! video

Ratio:

4:3

Chrome:

35px

CSS

#containingBlock {width:50%;}
.videoWrapper {
  position:relative;
  height: 0;
}
* html .videoWrapper {
  margin-bottom: 45px;
  margin-bot\tom: 0;
}
.videoWrapper div,
.videoWrapper embed, 
.videoWrapper object {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.wideScreen {padding-bottom:56.25%;}
.fourBYthree {padding-bottom:75%;}
.chrome_25 {padding-top:25px;}
.chrome_35 {padding-top:35px;}

Markup

<div id="containingBlock">
  ...
  <div class="videoWrapper wideScreen chrome_25">
    <div>
      <object width="480" height="295">
        <param name="movie" value="http://www.youtube.com/v/mDRYnaajUcY&hl=en&fs=1"></param>
        <param name="allowFullScreen" value="true"></param>
        <param name="allowscriptaccess" value="always"></param>
        <embed src="http://www.youtube.com/v/mDRYnaajUcY&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="295"></embed>
      </object>
    </div>
  </div>
  ...      
  <div class="videoWrapper fourBYthree chrome_35">
    <div>
      <embed src=http://d.yimg.com/cosmos.bcst.yahoo.com/up/fop/embedflv/swf/fop.swf?shareEnable=1&id=11795504&autoStart=0&infoEnable=0&shareEnable=0&prepanelEnable=1&carouselEnable=0&postpanelEnable=1 width=400 height=300 type=application/x-shockwave-flash></embed>    
    </div>
  </div>
  ...
</div>