Overflow-y: auto; failed to achieve the desired scrolling effect

my parent container sets height: 100%; overflow-y: auto; , but the scroll bar of body cannot scroll when
.main "s height is a fixed value, it works
but the percentage doesn"t work
similarly, I use 1fr of gird , and it doesn"t work either.

Sep.07,2021

.main doesn't work when the height is 100%!


html , body all need to set height:100%

<style>
html,body{
    height:100%;
    margin:0;
}
.con{
    height:100%;
    overflow:auto;
}
</style>

<div class="con">
    

... ... ...

</div>
< hr >

if the answer is useful to you, please like it and adopt it. Thank you ^

Menu