div { width:100% ; height:"66% de width"; } ? Résolu

Question

Bonjour,
Existe-t-il une astuce en CSS pour rendre la hauteur d'un bloc proportionnelle à sa largeur.
Autrement dit, que height soit toujours égal xx% de width, quelque soit la largeur de width.
Il me semble pas mais je pose la question au cas où.
Sinon j'utiliserai javascript...
Merci d'avance

TheLoulou11 · Accepted Answer

Tu mets ce que tu veux dans une div avec ce css :
.ta_div {
width: 100%
height: 0;
padding-top: 50%;
}

Ta div aura toujours pour hauteur la moitié de sa largeur.
Même si j'ai répondu un tard, j'espère aider certaines personnes.

Stanislas Poisson · Answer

Regarde cette video de grafikart, il explique comment mettre une viideo en responsive, cela correspond aussi a ce que tu veux faire

https://www.grafikart.fr/tutoriels/video-iframe-responsive-385

jemsss · Answer

Effectivement, width:100% était pour l'exemple et la plupart du temps c'est inutile.

Par contre dans ton exemple, height sera toujours à 40% de la hauteur du bloc parent si celle-ci est spécifiée, mais il ne sera pas à 40% de la largeur width. Selon la largeur de la fenêtre, la largeur du bloc s'adaptera mais la hauteur sera toujours la même, or je souhaite que la hauteur soit proportionnelle à la largeur...

tierez68 · Answer

Bonjour, tu trouve http://l4.yt/integrateurweb la réponse sur http://coin.des.experts.pagesperso-orange.fr/reponses/faq9_49/taille.html

Div { width:100% ; height:"66% de width"; } ?

4 réponses

Discussions similaires

Newsletters