javascript - Making a scrollable div which doesn't scroll the rest of the body -

Should be simple, but I can not work it

I have two pan on my webpage. I want to scroll both freely:

  & lt; Body & gt; & Lt; Div id = "sidebar" & gt; ... Too many content ... & lt; / Div & gt; & Lt; Div id = "container" & gt; ... Too many content ... & lt; / Div & gt; & Lt; / Body & gt; #sidebar {width: 200px; Status: fixed; Overflow: scroll; Background color: black; White color; Top: 0; Left: 0; Height: 100%; }  

Note that when you scroll down in the black sidebar, and keep scrolling, will the body start scrolling? From this I want to save, is there any easy way to get this?

Please follow the updated CSS. Here I set a 200px height, this will add the scroll bar to the # sidebar div.

  # sidebar {width: 200px; Status: fixed; Overflow: Auto; Background color: black; White color; Top: 0; Left: 0; Height: 200px; }  

Hope this can help. !!