Want to reduce the opacity of page contents container background without reducing the opacity of the contents.

<div id="container">
   <div id="page contents">
   page contents goes here, like amazing articles and all that.
   </div>
</div>

Needs to be able to expand with the content, thus can't have a fixed height.

Absolute positioning it underneath the content will mean there will be no relationship between the two divs and it wont expand with the contents, so I think this is a dead end, feel free to say otherwise.

Can't use Jquery as could be too laggy and not instant. Other options preferred please.

May have to use 'png' background images but were hoping not to as it is a template and needs to be able to change colour based on colour schemes.

Could generate images on demand but not ideal.

Oh and to top it off cant use CSS3 as wont work in IE! of course!

Any suggestions?