Automatically adjusting the width of right container on window resize

[leandro94]

In my template, wrapper div hold another two container. One is fixed position left div , and another one is absolute position right div. Right div contain another child div with width 100%. Html:\[code\]<div id ="wrapper"> <div class="left"></div> <div class="right"></div></div>\[/code\]CSS :\[code\] #wrapper {position:absolute; width:100%; height:100%;background:red;} .left {float:left; position:fixed; width:150px; height:100%;background:green;}.right {position:absolute; width:350px; height:100%; margin-left:150px;background:blue;}\[/code\]My target here is the \[code\]right\[/code\] container. I want to adjust width of this \[code\]right div\[/code\] on window re-size ,so its width remains (view-port width - left div width).I tried it with jquery:\[code\]var right_width_prcnt = (($(window).width()- 150)/($(window).width()/100) )function right_width_adjust() { $('.right').stop(false,true).animate({'width':right_width_prcnt + '%'});};var resizeTimer = null;$(window).bind('resize', function() { if (resizeTimer) clearTimeout(resizeTimer); resizeTimer = setTimeout(right_width_adjust, 100);});\[/code\]Jsfiddle for reference :http://jsfiddle.net/RWDQ2/2/Is there any css method (without jquery) to adjust width of right div = (window width -left div width) at all the time whenever we re-size window