<!DOCTYPE>
<html>
<span id="align-vw">This is 2vw vertical-aligned</span>
<span id="align-vh">This is -3vh vertical-aligned</span>
<span id="align-vmin">This is 5vmin vertical-aligned</span>
<span>This does not have vertical-align property set</span>
<script>
function applyStyle() {
    var viewportWidth = window.innerWidth;
    var viewportHeight = window.innerHeight;
    var viewportMinLength = Math.min(viewportWidth, viewportHeight);

    var elementStyle = document.getElementById("align-vw").style;
    elementStyle.verticalAlign = Math.floor(2 * viewportWidth / 100) + "px";

    var elementStyle = document.getElementById("align-vh").style;
    elementStyle.verticalAlign = Math.floor(-3 * viewportHeight / 100) + "px";

    var elementStyle = document.getElementById("align-vmin").style;
    elementStyle.verticalAlign = Math.floor(5 * viewportMinLength / 100) + "px";
}
applyStyle();
</script>
</html>
