I need help keeping a specific element at the initial 100% height of the viewport, without it resizing when the user changes their window size.
Should I use JavaScript to determine the initial viewport height and then pass those dimensions to the CSS? Can someone provide guidance on how to achieve this?
* {
margin: 0;
padding: 0;
}
.top {
height: 100vh;
width: 100%;
background-color: yellow;
}
.bottom {
height: 300px;
width: 100%;
background-color: red;
}
The top class is the div that I want to keep at its original 100% viewport height.