Print css stylesheet - div positioning

Hi I have just completed my site. I'm having problems with my print style. My html is as below:

开发者_StackOverflow社区

<div id="container">
<div id="main">
       <h1>title</h1>
        <div class="blockright">image in here and text</div>
         <p>paragraphs of text</p>
<div class="blockleft">image in here and text</div>
 <p>Even more paragraphs of text</p>

 <div class="clear"></div>

 <div class="footer">Copyright here</div>
</div>
</div>

.blockright has af ixed width and floats right

.blockleft has a fixed width and floats left has a width of auto

.main has a width and houses the content

In my print css, i would like .blockleft and .blockright to be aligned to the bottom of the printed page before the footer. Each page on the site has to be printable and I don't want to manually reposition the page to print the article or have to have a custom style for each page to print properly. Does anyone know how to get a div aligned to the bottom of the page. I tried absolute positioning but I could not get it to work. Any ideas?

Many thanks in advance

---

in your print style sheet

 #main {
   position:fixed;
   bottom:0;
   left:0;
   display:block
}

If you don't want all of #main to go to the bottom just wrap another div around .blockleft and .blockright and apply this css to it. Alas this will probably not work in IE6, however you may try applying some of the techniques used to apply a sticky footer to a page. here's one example http://ryanfait.com/sticky-footer/