Ok, I think I'm understanding now.
The way to create a page with two separate "content sections" is to arrange the content into separate block-level elements.
You can do this with a TABLE, or with DIV elements.
A DIV looks like:
<div id="leftSide">
Place whatever HTML you want here,
including scripts that generate content.
</div>
<div id="rightSide">
Place whatever HTML you want here,
including scripts that generate content.
</div>
Normally, the second DIV would display below the first DIV. You can change this behavior with CSS. The CSS attribute you'd use would be "float".
Here is a complete, though very simplistic, example:
<html>
<head>
<style type="text/css">
.left
{
float:left;
width:250px;
}
.right
{
float:right;
width:250px;
}
</style>
</head>
<body>
<div id="leftSide" class="left">
Place whatever HTML you want here,
including scripts that generate content.
</div>
<div id="rightSide" class="right">
Place whatever HTML you want here,
including scripts that generate content.
</div>
</body>
</html>
You should tinker with this, look up the CSS "float" attributes, understand what they do, as well as the other CSS properties (such as "width"). Learn the difference between CSS "class" definitions and "id" definitions.