Adding a scrollbar to a DIV layout Options

[lostnaivite]

So I recently decided to change my MySpace layout to a DIV layout that I found on another website (not sure if we're able to mention names of sites on here; either way, the name of the site doesn't matter). But now that I've actually added some text to it, the page is stretched out vertically, whereas, I'd like the main text box (the one with "Hi, my name is Hannah..." etc., etc., in it) to scroll. Is there any way to do that? Also, is there any way to make everything in the main text box be aligned to the center of the scrollbox? Here's the code for my MySpace:

CODE

<style type="text/css">
tr, td table table, table table table table, table, { height:0px; border:0px;}
table table table table, table table table table td.text, td.text td.text table { display:none;}
td.text table table { display:inline; visibility:visible;}
table td table tr td.text table { visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text { visibility:visible;}
table, tr, td { background-color: transparent; border: 0px; }
td td td td { border:0px; width:0px; text-align:left;}
a.text { visibility:hidden; height:0px; }
table div font a { visibility:hidden; height:0px; }
table div div { visibility:hidden; height:0px; }
.navbar font { visibility:hidden; height:0px; }
tr td font { visibility:hidden; height:0px; }
body {
scrollbar-face-color:ffffff;
scrollbar-shadow-color:c66c7b;
scrollbar-highlight-color:c66c7b;
scrollbar-3dlight-color:c66c7b;
scrollbar-darkshadow-color:c66c7b;
scrollbar-track-color:c66c7b;
scrollbar-arrow-color:ffffff;
background-image: url(http://jpg); background-attachment: fixed; background-position: bottom left; background-repeat:no-repeat; background-color:c66c7b;}
table table table {width:100%; padding:0; background-color:transparent;}
b { font-family: georgia; color: c66c7b; }
i { font-family:georgia; color: c66c7b; }
u { color: c66c7b; }
li, p, div, .text, table, tr, td
{ font-family:century gothic, verdana, century gothic; font-size:9; letter-spacing: 0pt; color:4f4f4f; text-transform: lowercase; font-weight: normal; line-height: 12px;}
.whitetext12, .nametext, .lightbluetext8, .orangetext15, .blacktext12, .btext, .redtext, .redbtext, .contacttable
{display:none;height:0px;visibility:hidden}
a:active, a:visited, a:link
{ font-family:century gothic; color:c66c7b; font-size:9; text-decoration:none; font-weight:normal; }
a:hover
{ font-family:century gothic; color:c66c7b; font-size:9; text-decoration:none; font-weight:normal; }
a.navbar:active, a.navbar:visited, a.navbar:link
{ font-family:arial; font-size:9; color:ffffff; font-weight:normal; text-decoration:none; }
a.navbar:hover
{ font-family:arial; font-size:9; color:ffffff; font-weight:normal; text-decoration:none; }
input, textarea
{ color:4f4f4f; background:ffffff; font-family:arial; font-size:9; text-align:left; border: 1px solid; border-color:c66c7b; }
.top
{
position: absolute; left: 50%; margin-left: -290px; top: 164px; z-index:1; width: 545px; overflow: no;
}
.contents
{
position: absolute; left: 50%; margin-left: -211px; top: 290px; z-index:1; width: 308px; overflow: no;
color:4f4f4f; background-color:ffffff; font-family:arial; font-size:11; text-align:left;
background-image: url(http://i84.photobucket.com/albums/k14/xox0xo/aerocharm/divoverlays/quotes/05/bottom.gif); background-position: bottom center; background-repeat:no-repeat;
}
.menus
{
position: absolute; left: 50%; margin-left: 103px; top: 394px; z-index:1; overflow: no;
}
.navigationBar{display:none;}
</style>
<style>.navigationBar{margin-top:-5px;}</style>
<map name="top">
<area shape="rect" coords="88,92,122,108" href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2Vy">
<area shape="rect" coords="122,94,173,109" href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld3BpY3R1cmUmZnJpZW5kaWQ9MjM4NDgwOTMxJmFsYnVtaWQ9MA==">
<area shape="rect" coords="173,95,227,109" href="http://www.msplinks.com/MDFodHRwOi8vbWFpbC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1tYWlsLm1lc3NhZ2UmZnJpZW5kaWQ9MjM4NDgwOTMx">
<area shape="rect" coords="227,94,251,110" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRpZD0yMzg0ODA5MzE=">
<area shape="rect" coords="252,94,287,109" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9jay5ibG9ja3VzZXImdXNlcmlkPTIzODQ4MDkzMQ==">
<area shape="rect" coords="288,95,344,108" href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTIzODQ4MDkzMQ==">
<area shape="rect" coords="343,94,375,108" href="http://www.msplinks.com/MDFodHRwOi8vYmxvZy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9nLmxpc3RhbGwmZnJpZW5kaWQ9MjM4NDgwOTMx">
</map>
<center>
<div class="top">
<img src="http://i84.photobucket.com/albums/k14/xox0xo/aerocharm/divoverlays/quotes/05/top.gif" border="0" usemap="#top">
</div>
<div class="contents"><table><tr><td align="center" width="300"style="width: 300px;"><img src="http://mn.lilypie.com/jU2Am5.png" alt="Lilypie Next Birthday Ticker" border="0" /><br><br>
Hi, my name is Hannah. I'm 20-going on-21 years old and I live in a small town in Massachusetts, about 30 minutes away from Boston. I'm a second-year student at Middlesex Community College, and I'll be graduating from MCC on my birthday, actually, with an Associate's Degree in Liberal Arts and Sciences. After I graduate, I'm going to go on to a four-year college to major in English. After college, I hope to find a job as an editor at a publishing firm. I've always had an intense love for languages, so deciding to major in English was pretty much a no-brainer for me.<br><br>I so painfully wish I were better at making (and keeping) friends, but I just wasn't born that way. I was born with social anxiety and Asperger's Syndrome, and I now have depression, too. Putting myself out there is extremely hard for me, whether that means looking for friends, looking for a date, or looking for a job. I'd much rather stay away from other people and talk to them online, where they cannot judge me as much as they can in person. Even online, it's hard for me to get close to people, though. My confidence is often very low, so I don't feel like I'm worthy of being anyone's friend. I don't say that so you can feel sorry for me. I simply say that because it's the truth.<br><br>I am a bit agoraphobic and would rather stay in my room than go out into the world. This did cause me a bit of trouble when I was 18 and a freshman at Wheelock College. During spring semester of that year, I became intensely agoraphobic and eventually stopped going to classes altogether. I even tried to cut off ties with my family, because I felt like I was too much of a screw-up for them. Needless to say, my grades were quite low that semester. I'm constantly worried that I'm going to go back to my "Wheelock self" and that thought either: a) helps to motivate me to go to classes or b) causes me to retreat even more into my shell. How I react to that thought depends on how motivated I'm feeling at the moment.<p style="visibility:visible;"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="155" width="218" align="middle" data="http://www.mp3asset.com/swf/mp3/myflashfetish-mp3-player.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.mp3asset.com/swf/mp3/myflashfetish-mp3-player.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="flashvars" value="myid=9063248&path=2008/04/08&mycolor=0x180D09&mycolor2=0xDD15BC&mycolor3=0x1B68F1&autoplay=true&rand=0&f=3&vol=100&pat=7" />
</object></p></p><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="0" width="0" data="http://counters.gigya.com/wildfire/CIMP/Jmx*PTEyMDc2NjYwMTA1NDYmcHQ9MTIwNzY2NjAzMTU2MiZwPTE4MDMxJmQ9Jm49.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://counters.gigya.com/wildfire/CIMP/Jmx*PTEyMDc2NjYwMTA1NDYmcHQ9MTIwNzY2NjAzMTU2MiZwPTE4MDMxJmQ9Jm49.swf" />
<param name="flashvars" value="" />
</object>
</td></tr></table></div>
<div class="menus">

<select name="INTERESTS" style="background-color:ce7685;border-style:solid;border-width:1px;border-color:4f4f4f;font-family:century gothic, arial;text-transform:none;color:ffffff;font-size:9;width:160px;">
<option>INTERESTS</option>
<option>Spending time with my friends</option>
<option>Learning how to stay calm</option>
<option>Going to the local library</option>
<option>Reading</option>
<option>Listening to music</option>
<option>Going online</option>
<option>Watching movies</option>
</select>

<br><br>

<select name="TELEVISION" style="background-color:ce7685;border-style:solid;border-width:1px;border-color:4f4f4f;font-family:century gothic, arial;text-transform:none;color:ffffff;font-size:9;width:160px;">
<option>TELEVISION</option>
<option>It's Me or the Dog</option>
<option>The Simpsons</option>
<option>Family Guy</option>
<option>Futurama</option>
<option>I Love Lucy</option>
<option>The Ellen Degeneres Show</option>
<option>Frontline</option>
<option>Wicked</option>
</select>

<br><br>

<select name="MOVIES" style="background-color:ce7685;border-style:solid;border-width:1px;border-color:4f4f4f;font-family:century gothic, arial;text-transform:none;color:ffffff;font-size:9;width:160px;">
<option>MOVIES</option>
<option>Juno</option>
<option>The Sound of Music</option>
<option>Mary Poppins</option>
<option>Finding Nemo</option>
<option>The Little Mermaid</option>
<option>Beauty and the Beast</option>
<option>Aladdin</option>
<option>Fantasia</option>
</select>

</div>

Thanks so much in advance!

~Hannah

[miyashu]

Try setting a height to the content. I've added it here:

.contents{position: absolute; left: 50%; margin-left: -211px; top: 290px; z-index:1; width: 250px; height:300px; overflow: auto !important;color:4f4f4f; background-color:ffffff; font-family:arial; font-size:11; text-align: center !important; background-image: url(http://i84.photobucket.com/albums/k14/xox0xo/aerocharm/divoverlays/quotes/05/bottom.gif);background-position: bottom center; background-repeat:no-repeat;}

Now all you need to do is adjust the number to your liking.