I'm interested in adjusting the padding value of a button element based on the height of the browser window, not its width. I want to make sure that the padding adjusts proportionally to the browser window's height. Is this achievable using CSS?
.btn {
padding: calc(2vh + 2vw);
}<div class="position">
<button class="btn bg-primary btn-lg">PLAY</button>
<br>
<br>
<button class="btn bg-primary btn-lg">SIGN IN</button>
<br>
<br>
<button class="btn btn-lg bg-primary">SETTINGS</button>
<br>
<br>
<button class="btn bg-primary btn-lg">ABOUT</button>
<br>
<br>
</div>