垂直滚动条显示

我想知道它是如何可能永久显示一个 div 的垂直条(灰色的,如果没有滚动)类似于我们的常规条。基本上,我试图把整个网站放在一个 div (如 gmail/facebook) ,所以如果页面不够长,整个页面移动,因为缺乏垂直滚动条。

我需要一个解决这个问题的办法。我尝试了溢出-y: 滚动。但它似乎根本不起作用。

606710 次浏览

Have you tried overflow-y:auto ? It is not exactly what you want, as the scrollbar will appear only when needed.

What browser are you testing in?

What DOCType have you set?

How exactly are you declaring your CSS?

Are you sure you haven't missed a ; before/after the overflow-y: scroll?

I've just tested the following in IE7 and Firefox and it works fine

<!-- Scroll bar present but disabled when less content -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
test
</div>


<!-- Scroll bar present and enabled when more contents -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
</div>

Always : If you always want vertical scrollbar, use overflow-y: scroll;

jsFiddle:

<div style="overflow-y: scroll;">
......
</div>

When needed: If you only want vertical scrollbar when needed, use overflow-y: auto; (You need to specify a height in this case)

jsFiddle:

<div style="overflow-y: auto; height:150px; ">
....
</div>

In reactjs...

<div className='p-4 mb-4' style=\{\{overflowY:'scroll',height:'350px'}}>
{msgx.map((m,index)=>{
return(
<Items m={m} key={index} i={index}/>
)
})}
</div>