Problem with using blueprint css framework with IE.

Question

Hi,

I am using blueprint and am using sticky footer(cssstickyfooter), it works fine with FF & Chrome.

By default there is 10px padding on the either side, but with IE 8, there is no padding on the left, and the padding on the right increases 20px (double of 10px).

<style type="text/css">
       html, body {height: 100%;}

       #wrap {min-height: 100%;}

       #main {overflow:auto; padding-bottom: 20px;}

       #footer {position: relative; margin-top: -20px; height: 20px; clear:both;} 

       /*Opera Fix*/

       body:before { content:""; height:100%; float:left; width:0; margin-top:-32767px;}
</style>

<!--[if !IE 7]>
<style type="text/css">
       #wrap {display:table;height:100%}
</style>
<![endif]-->


  <div id="wrap">
   <div id="main">
      <!--- My content goes here --->

       </div>
   </div>       

   <div id="footer">
      <!-- Basic footer -->
   </div>

Is there a fix for it or how could I fix it?

Thanks.