<!DOCTYPE html> | |
<!-- | |
| The "vw" equal to 1% of the width of the initial containing block. | |
| The "vh" equal to 1% of the height of the initial containing block. | |
| https://www.w3.org/TR/css3-values/#viewport-relative-lengths | |
| This test only passes when viewport is 640 x 360. | |
--> | |
<html> | |
<head> | |
<style> | |
body { | |
font-family: roboto; | |
} | |
div { | |
width: 50vw; | |
height: 50vh; | |
font-size: 5vw; | |
background-color: #00F; | |
} | |
</style> | |
</head> | |
<body> | |
<div> | |
Width, height and font-size are of vw, vh units. | |
</div> | |
</body> | |
</html> |