Единици vw и vh в CSS

Единиците vw и vh позволяват да се зададе размер спрямо областта за преглед на прозореца на браузъра. Нека да разгледаме пример.

Да предположим, че имаме някакъв div:

<div></div>

Нека му зададем ширина, равна на половината от ширината на областта за преглед, и височина, равна на половината от височината на областта за преглед:

div {
	width: 50vw;
	height: 50vh;
	margin: 30px auto;
	border: 1px solid red;
}

Нека видим какво получихме:

Даден е div. Задайте му отстъп отгоре, равен на 30% от височината на областта за преглед.

Даден е div. Задайте му ширина и височина, равни на 70% от ширината на областта за преглед.