Posted By

OrngTicTac on 05/17/12


Tagged

video responsive


Versions (?)

Responsive Video


 / Published in: CSS
 

URL: http://webdesignerwall.com/tutorials/5-useful-css-tricks-for-responsive-design

This responsive video CSS trick was discovered by tjkdesign.com. I've blogged about it before, you may read the details here. It makes the video embed to expand fullwidth to the boundary.

  1. .video {
  2. position: relative;
  3. padding-bottom: 56.25%;
  4. height: 0;
  5. overflow: hidden;
  6. }
  7.  
  8. .video iframe,
  9. .video object,
  10. .video embed {
  11. position: absolute;
  12. top: 0;
  13. left: 0;
  14. width: 100%;
  15. height: 100%;
  16. }

Report this snippet  

You need to login to post a comment.