CSS for forcing the browser to display scrollbar

Question

I've written a web application and found that when I resize the page, the browser doesn't display it's own scrollbar as the window shrinks. This prevents the user from accessing content. I've set my body width to 500px and set the navbar to white-space:nowrap. How can I get the browser to recognize that there is content to the right of the screen?

Just to clarify I want the browser's scrollbar and not a scroll bar on any control.

Answer 1

You can use one of the following depending on whether you want horizontal, vertical, or both scrollbars to be added:

body    {overflow-x:scroll;}
body    {overflow-y:scroll;}
body    {overflow:scroll;}

However, I think if you show the content in a section and then do

#id-of_your_div {overflow:scroll;}

So that you add scroll to the div rather than force the browser to show scrollbars, then your page will provide a much better user experience since such scrollbars are easier for users to access.

Answer 2

You can set the height or width of the body/element to 100.1% depending on which direction and element you want to have scrollable.