DIV+CSS布局左侧不固定，右侧固定，如何实现？

当左侧有一个宽图超过屏幕大小（需要完全显示），让页面撑出屏幕，不被挤到下面，右侧仍在右侧，

<div id="container">
<div id="sidebar">This is the sidebar</div>
<div id="content">2列当左侧有一个宽图超过屏幕大小（需要完全显示），让页面撑出屏幕，不被挤到下面，右侧仍在右侧，<img name="" src="" width="1000" height="32" alt="" /> </div>
</div>

CSS应该如何做？

body { font-family:Verdana; font-size:14px; margin:0;}

#container {margin:0 auto; width:100%;}
#sidebar { float:right; width:200px; height:500px; background:#9c6;}
* html #sidebar{margin-left:-3px;}/*使用此方法解决ie 3像素bug可通过验证*/
#content { height:500px; background:#ffa;}
zcqh520：
能不能写一下代码，谢谢，我不会CSS，呵，
而且定位好像右侧的层会覆盖左侧，我想让右侧随左侧延伸，就像使用表格的效果一样，

新英阻鼾器:
#content { height:500px; background:#ffa;overflow:hidden;margin-right:X px}
这样加对吧？还是不行啊，图片还是会移下去，X还是变成数字？但都不行哦，

liushui101：
#sidebar { float:left; width:200px; height:500px; background:#9c6;z-index:99;position:absolute;left:0px;top:0px;}
这样改了右侧内容成左侧了，而且覆盖了原左侧的层，

xbc0010249:
是给content加overflow:auto么？没有变化啊，