VESELOV.SUMY.UA

Пропорциональное масштабируемое видео и валидный youtube

---

Пропорциональное масштабируемое реализовано за счет позиционирования блоков и процентных соотношений. Применимо на резиновых сайтах.
CSS

#containingBlock {
  width:50%;
}
.videoWrapper {
  position: relative;
  padding-bottom:56.25%;
  padding-top:25px;
  height:0;
  overflow:hidden;
}
.videoWrapper div,
.videoWrapper object {
  position:absolute;
  top:0;
  left:0;
  width: 100%;
  height:100%;
}

Код видео с ютуба по умолчанию не валидный, здесь же он добавлен в соответствии стандартам

HTML

  

    

      
      
      
    

    
Following is the description of the video embeded in this document

    
This short clip is about YouTube widescreen formatting. It shows the two main formats (16:9, 4:3) and also explains the best way to create a Flash movie according to the new widescreen format.

  

  ...

Очень мне нравится девочка с видео демки -)

ДЕМО: https://veselov.sumy.ua/uploads/files/demo/003/index.html