javascript - Why do I set height: 100%; overflow: hidden; but the content and scroll bar still overflow. Please give me advice?

Question

Answer 1

How about changing

height to an absolute value? And your screenshot overflow-y is auto. Why not use hidden

Answer 2

The screenshot is not very clear. Who is it 100% based on?

Answer 3

I guess it’s because you used overflow: hidden and float at the same time.

It is necessary to understand the detailed explanation of CSS BFC and the origin of float and overflow: hidden. We have cleared the floats together in those years.
I will post some related questions for you. Please understand more and find solutions:
In CSS Why can overflow:hidden clear the impact of float? What is the principle?

Answer 4

The outermost p needs to have a fixed height, and ul is the height: 100%;

Answer 5

Is your ulthere is something at the same level? height: 100% will inherit the height of the parent. If ulhas content at the same level, it will hold ul down. It is recommended to wrap a p suitable for the height on the outer layer, and write ulscroll inside the p

Answer 6

height: 100% height is inherited from the upper layer