cagartner
11/26/2013 - 2:59 PM

Vídeos responsivo Less - CSS

Vídeos responsivo Less - CSS

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
    border: solid 4px #f6e9d5;
    // - See more at: http://avexdesigns.com/responsive-youtube-embed/#sthash.AwuhlNqB.dpuf
		
    iframe, 
    object,
    embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}
<div class="video-container">
    <iframe width="700" height="420" src="//www.youtube.com/embed/mgIum7-dh5w?rel=0" frameborder="0" allowfullscreen itemprop="embedURL"></iframe>
</div>
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
    border: solid 4px #f6e9d5;
}

.video-container iframe, 
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}