[SOLVED] Width Auto Ajust

[The Little Guy]

I have 3 divs, one is a container, and two are positioned absolute.

 

the one on the left is 350px wide, but the other one should expand to fit the rest of the page.

 

if you look here, it is the right div that messes it all up. On some screens it is too wide, some it is too small, and some it fits just right. Basically there is supposed to be about a 20px margin between the white and your browsers edge. So how can I fix this?

Link: http://www.wtf.publicsize.com/

 

Here is my CSS:

#container{
width:100%;
}
#left{
width:330px;
min-height:356px;
background-image:url('/images/left.jpg');
background-repeat:no-repeat;
background-position:1 0;
top:370px;
left:20px;
}
#right{
width:71%;
min-height:456px;
top:270px;
left:350px;
}
#right, #left{background-color:#FFF;position:absolute;}

 

And here are my three divs:

<div id="container">
	<div id="left">
	</div>
	<div id="right">hi
	</div>
</div>

[rhodesa]

here is an example:

 

<style>
#container{
   position: relative;
   padding-left: 350px;
}
#left{
   position: absolute;
   left: 0px;
   width: 330px;
   height: 500px;
   background: blue;
}
#right{
   height: 500px;
   background: red;
}
</style>
<div id="container">
   <div id="left"></div>
   <div id="right"></div>
</div>

[The Little Guy]

Thanks! It works, with a few tweaks I got it how I needed it!