Kevin Powell - CommunityKP-C
Kevin Powell - Community•3y ago•
3 replies
Aditya Kirad

getting two different value for the full viewport height using css and javascript

hey folks I'm using these two different methods to get the full viewport height I dont know why these are giving two different values

1st Method by pure css
.root {
    display: flex;
    height: 100vh;
}

computed value of height for above method is 664px

2nd method by javascript and css

const vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`

.root {
    display: flex;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);

computed of height value for the above method is 641px
Was this page helpful?