VW- ja VH-yksiköt CSS:ssä
Yksiköt vw ja vh mahdollistavat
koon asettamisen suhteessa selaimen ikkunan
näkymän alueeseen. Katsotaanpa esimerkkiä.
Oletetaan, että meillä on tietty div:
<div></div>
Asetetaan sille leveys, joka on puolet näkymän leveydestä, ja korkeus, joka on puolet näkymän korkeudesta:
div {
width: 50vw;
height: 50vh;
margin: 30px auto;
border: 1px solid red;
}
Katsotaan, mitä saimme aikaan:
Annettu div. Aseta sille yläreunainen marginaali, joka on
30% näkymän korkeudesta.
Annettu div. Aseta sille leveys ja korkeus, joka on
70% näkymän leveydestä.
