"Video à la Une" : Lecteur élastique en fonction du navigateur ( voir...

"Video à la Une" : Lecteur élastique en fonction du navigateur ( voir http://webdesignerwall.com/demo/elastic-videos/)

noisettes/sommaire/video_alaune.html

@@ -37,7 +37,7 @@
 </BOUCLE_ImageLien>
 </div><!-- /VideoALaUne -->
 </B_ImageLien>
-[<div class="VideoALaUne"><h2 class="#EDIT{titre}"><a href="#URL_ARTICLE"[ title="(#_Article_VideoALaUne:DESCRIPTIF|attribut_html)"]>#_Article_VideoALaUne:TITRE</a></h2><div class="#EDIT{chapo}">(#CHAPO)</div></div><!-- /VideoALaUne -->]
+[<div class="VideoALaUne"><h2 class="#EDIT{titre}"><a href="#URL_ARTICLE"[ title="(#_Article_VideoALaUne:DESCRIPTIF|attribut_html)"]>#_Article_VideoALaUne:TITRE</a></h2><div class="video-container"><div class="#EDIT{chapo}">(#CHAPO)</div><!--video-container--></div></div><!-- /VideoALaUne -->]
 <//B_ImageLien>
 <//B_VideoALaUne>
 </BOUCLE_Article_VideoALaUne>

stylescommuniquant.css.html

@@ -65,6 +65,22 @@ div#content { margin: 0; width:#GET{LargeurContaineur}px; }
 	clear: both;
 	padding: 0 8px;
 }
+/*************** VIDEO A LA UNE */
+.video-container {
+	position: relative;
+	padding-bottom: 56.25%;
+	padding-top: 30px;
+	height: 0;
+	overflow: hidden;
+}
+.video-container iframe, .video-container object, .video-container embed {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+
 #communiquant_content_extra .goodies {
 	clear: left;
 	float: left;