I am wondering how its possible to permanently show the vertical bar of a div (greyed out if there is no scrolling) similar to our regular bars. Basically I am trying to place an entire website in a div (like gmail/facebook), so if the page is not long enough the whole page shifts because of the lack of the vertical scroll bar.
I need a solution to this problem. I tried overflow-y:scroll. But it doesn't seem to work at all.
To show the scrollbars always on the webpage, use overflow: scroll Property. It will add both horizontal and vertical scrollbars to the webpage. To add only horizontal scrollbar use overflow-x: scroll property and for vertical scrollbar use overflow-y: scroll property.
For horizontal scrollable bar use the x and y-axis. Set the overflow-y: hidden; and overflow-x: auto; that will automatically hide the vertical scroll bar and present only the horizontal scrollbar. The white-space: nowrap; property is used to wrap text in a single line.
It can be easily done by using the overflow property. The overflow property has different values. E.g., overflow: auto; and an axis hiding procedure like overflow-x: hidden; and overflow-y: auto; will make a bar scrollable vertically and horizontally, and the "auto" value will add only a vertically scrollable bar.
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With