how to add scroll bar to #content?

Dear all,

My webpage is divided into
- #header
- #nav (which is a toolbar on the left)
- #content
- #footer

How can I add a scroll bar to my #content (so that only my content scrolls up and down, with my navigation, header and footer all remaining not moving). This is an example (although I prefer to have a different scroll bar): http://www.zhangxiaogang.org/Enworks.aspx?type=year

Thank you so much!!

overflow:scroll;

It needs to have width and height too.

Thanks, but how/where exactly do I put that in my css (or html)? can you give me the specific code? sorry, i'm a beginner.

This is the page I want to have the scrollbar: http://www.lixiao-art.com/broken.html

This is my external css:

body { font-family: Verdana;
color: white;
margin: 0px;
background-color: black;
}

#header { font-family: courier new;
padding-left: 40px;
padding-top: 5px;
padding-bottom: 5px;
border: none;
background-color: white;
margin-bottom: 0px; }

#content {float: left;
padding: 30px 20px 100px 100px;
width: 650px;
margin: 0px;
border: none;
font: white;
font-family: Arial;
background-color: black; }



#content a {text-decoration:underline}


h2 {height: 2em;}

#nav {float: left;
text-align: right;
font-size: small;
width: 180px;
margin-top: 30px;
font-weight: bold;
padding: 10px;
border: none;
}

#footer { font-family: arial;
padding-top: 10px;
padding-bottom: 10px;
width: 100%
border: none;
background-color: black;
color: white;
margin-bottom: 0px;
}


a{text-decoration: none;
color: white;}
a:hover {color: red;}



* {margin: 0;}
html, body {height: 100%;}

.wrapper {min-height: 100%;
width: 1500px;
height: auto !important;
height: 100%;
margin: 0 auto -1.5em;}

.footer, .push { height: 1.5em; }

.ImgBorder img { border:1px solid transparent;
height:100px;
}
.ImgBorder:hover img{ border-color: red}

.ImgBorder {display: block;
float: left;
margin: 30px 20px; }
h5{
clear:both
}

img { border: none; }

Just put it in with all the other content css.

overflow-y:scroll