...ive / .wrap {position:relative; width:100%; height:0; margin-bottom:10%; overflow:hidden;} / use overflow:hidden to crop the left and right overlap of the resized video / / calculate the height of the 'wrap' depending on the aspect ratio required / .ratio-16-9 {padding-top:calc(100%/(16/9));} .ratio-3-2 {padding-top:calc(100%/(3/2));} .ratio-4-3 {padding-top:calc(100%/(4/3));} .ratio-16-9 iframe {width:100%; height:100%; position:absolute; top:0; left:0;} / as the original video has the aspect ratio 16:9 the width and height of the iframe is 100% / / the new width is the new height the original aspect ratio */ / the left position is the (wrap width - the new width) divided by 2 / .ratio-3-2 iframe {width:calc((100%/(3/2)) (16/9)); height:100%; position:absolute; top:0; left:calc((100% - ((100%/(3/2)) (16/9))) / 2);} .ratio-4-3 iframe {width:calc((100%/(4/3)) (16/9)); height:100%; position:absolute; top:0; left:calc((100% - ((100%/(4/3)) (16/9))) / 2);} / fin videos / .embed-responsive {position: relative;display: block;height: 0;padding: 0;overflow: hidden;} .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object { position: absolute; top: 0; left: 0; bottom: 0; height: 100%; width: 100%; border: 0;} .embed-responsive.embed-responsive-kat { padding-bottom: 100%;} .embed-responsive.embed-responsive-16by9 {padding-bottom: 56.25%;} .embed-responsive.embed-responsive-4by3 {padding-bottom: 75%;} html <!-- 16:9 aspect ratio --> <div class="embed-responsive embed-responsive-16by9" align="center"><video class="embed-responsive-item" controls="controls" width="300" height="150"> <source src="http://cdn1.wibbitz.com/page/videos/31844b24a44c428c98512d2ea57bdd35.mp4" type="video/mp4" /> </video></div> c'est moche quand le plugin flash est désactivé.est-il possible d'intégrer des vidéos you tube en html...