Unités vw et vh en CSS
Les unités vw et vh permettent de définir
la taille par rapport à la zone d'affichage de la fenêtre
du navigateur. Regardons un exemple.
Supposons que nous ayons une certaine div :
<div></div>
Définissons-lui une largeur égale à la moitié de la largeur de la zone d'affichage et une hauteur égale à la moitié de la hauteur de la zone d'affichage :
div {
width: 50vw;
height: 50vh;
margin: 30px auto;
border: 1px solid red;
}
Voyons ce que nous obtenons :
Une div est donnée. Définissez-lui une marge supérieure égale à
30% de la hauteur de la zone d'affichage.
Une div est donnée. Définissez-lui une largeur et une hauteur égales à
70% de la largeur de la zone d'affichage.