These units allow you to specify sizes in terms of percentages of the viewport width and viewport height. See also the test page without a meta viewport.
The allowed units are:
vw
: hundredths of the viewport width.vh
: hundredths of the viewport height.vmin
: hundredths of whichever is smaller, the viewport width or height.vmax
: hundredths of whichever is larger, the viewport width or height.Here are some examples. 50vw
means 50% of the viewport width.
Don’t forget to resize your browser window to see the boxes resize automatically.
width: 50vw
.width: 50vh
.width: 50vmin
.width: 50vmax
.