help: repositioning items in a user control using Javascript

[Joe Helmick]

This one has me really stumped, so I thought I'd ask publicly.

I was trying to take my ASP.NET web page "template" -- banner graphic, small
navigation bar, and user feedback message area -- and make it into a user
control. I wanted to stretch one of the graphics so it always went all the way
across the browser window. So far, so good... And then, I wanted to take the
two-cell table that holds the naviagation bar and make it always appear on the
far right of the browser window. That didn't work. No matter what I've tried,
it always appears where the initial "style" positioning info says it should.

Can someone help me get this right?

Here is the source for the user control:

<%@ Control Language="vb" AutoEventWireup="false"
Codebehind="uc_Banner1.ascx.vb" Inherits="ADview2.uc_Banner1"
TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>

<script type="text/javascript" language="JavaScript">
<!--
function resizeStuff() {
var browser_width;
browser_width = document.body.clientWidth;
document.getElementById('imgColorBar').width=brows er_width;

document.getElementById('navbar').left=browser_wid th-document.getElementById('navbar').width;
debugger;
}
-->
</script>

<LINK href="ADview2Styles.css" type="text/css" rel="stylesheet">
<asp:imagebutton id="imgLogo" style="DISPLAY: inline; LEFT: 6px; POSITION:
absolute; TOP: 0px" ImageUrl="images\logo_small.png"
Height="39" Width="81" Runat="server"></asp:imagebutton>
<!---->
<asp:label id="stPageTitle" style="DISPLAY: inline; LEFT: 102px; POSITION:
absolute; TOP: 4px"
Height="32" Width="499px" Runat="server" CssClass="pagetitle" >PAGE
TITLE</asp:label>
<!---->
<IMG id="imgColorBar" alt="" src="images\imgColorBar.png" style="DISPLAY:
inline; LEFT: 6px; POSITION: absolute; TOP: 40px"
Height="20" Width="752">
<!---->
<asp:label id="stInstructions" style="DISPLAY: inline; LEFT: 6px; POSITION:
absolute; TOP: 64px"
Runat="server" CssClass="stepdescription" Height="64" Width="750">
The quick brown fox jumped over the lazy dogs.
</asp:label>
<!---->
<table id='navbar' style="DISPLAY: inline; LEFT: 650px; POSITION: absolute; TOP:
2px" cellSpacing="0" cellPadding="0" width="78" height="33" border="0">
<tr>
<td><a href="frmHome.aspx"
onmouseover="MM_swapImage('button_home','','http://localhost/adview2/toolbar/button_home_f2.gif',1);"
onmouseout="MM_swapImgRestore();" ><img name="button_home" alt="home"
src="http://localhost/adview2/toolbar/button_home.gif" width="34" height="33"
border="0"></A></td>
<td><a href="frmChecklist.aspx"
onMouseOver="MM_swapImage('button_checklist','','h ttp://localhost/adview2/toolbar/button_checklist_f2.gif',1);"
onMouseOut="MM_swapImgRestore();" ><img name="button_checklist" alt="checklist"
src="http://localhost/adview2/toolbar/button_checklist.gif" width="37"
height="32" border="0"></a></td>
</tr>
</table>

<script type="text/javascript" language="JavaScript">

<!--
window.onload=resizeStuff;
window.onresize=resizeStuff;
-->
</script>