Frameset Alternative for HTML with Scrollbars

I need to have 3 areas within one webpage - and I'm struggling to find a solution.  As frames are not gonna be supported in HTML5, what alternatives do we have?

I suppose I could use partials and AJAX, but I do need the nice ability to scroll both vertically and horizontally for each of the 3 areas, a feature the a frame automatically gives.

Any ideas please?
geoffrey1211Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GawaiCommented:
how about using <div> ?

<div align="center" STYLE="overflow: auto; width: 100%; height: 50%;">
<div align="center" STYLE="overflow: auto; width: 200; height: 200;">
<table frame="border">
<col width ="10%"><col width ="15%"><col width ="15%"><col width ="15%"><col width ="15%">
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
<tr><td>1232134</td><td>asdfasdfas</td><td>3</td><td>01/01/2000</td><td>3.00</td></tr>
</table></div></div>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
geoffrey1211Author Commented:
This works fine.  Should I just use this to update content then?
document.getElementById('div_id').innerHTML = 'whatever content';

Are each <div> considered to be completely separate from other <div>s, except when I'm using the float property?  Is it the z-index property to determine which one shows above another?

I haven't used CSS for > 10 years I'd be delighted to be shined upon some light.  Thank you.
0
JESiiCommented:
There's a feature in CSS that supports  scrollbars:
   overflow: scroll

Here's a a very straight-forwad example by the folks at Quackit (http://www.quackit.com/css/css_scrollbars.cfm).

<style>
.contentBox {
	display:block;
	border-width: 1px;
	border-style: solid;
	border-color: 000;
	padding:5px;
	margin-top:5px;
	width:200px;
	height:50px;
	overflow:scroll
	}
</style>
<div class="contentBox">
Why do I call them "CSS Scrollbars"? The <i>CSS Overflow</i>
property tells the browser what to do if the box's contents is larger
than the box itself. It behaves similar to inline frames and creates
scrollbars if required. That is why I call them CSS Scrollbars!
</div>

Open in new window

0
geoffrey1211Author Commented:
i could use a bit more info on s
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Ruby

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.