For IE i want to use layers

I am talking about my website (in my sig) it searches for competitor's strenght to beat in serp for particular keyword.So it has to analyse bit more data and user has to wait bit more.But it is performing quite right without any complain for firefox+opera users because these browsers display data of table row by row but problem is with Internet explorer because it displays table altogether so my IE users have to wait little more which is not suitable for me and them.

I want to use layers for IE users but have no idea how to replace table code with layers code for IE users.

Kindly help me in replacing table code with div layers code.
Thank You.

 

play with:

<style type="text/css"> 
body { 
   font-family: helvetica, arial, sans-serif; 
   font-size: 62.5%; 
   background-color: 1a1a1a; 
} 

   table, td { 
      background-color: 1a1a1a; 
   } 

.main{ 
   position:absolute; 
   left:50%; 
   top:0px; 
   width:800px; 
   z-index:1; 
   margin-left:-400px; 
} 

   .main a:link, .main a:active, .main a:visited { 
      color: a3bdc8; 
      text-decoration: none; 
      font-size: 1em; 
   } 

   .main a:hover { 
   color: ffffff; 
   } 
    
img { 
   border: 0; 
   filter:alpha(opacity=80); 
   -moz-opacity: 0.80; 
   opacity: 0.80; 
} 

   img:hover{ 
      filter:alpha(opacity=95); 
      -moz-opacity: 0.95; 
      opacity: 0.95; 
   } 

p, li { 
   font-size: 1.2em; 
   color: f0f0f0; 
} 

.title1, .title2 { 
   font-weight: bold; 
   text-transform: lowercase; 
   letter-spacing: -1px; 
   color: dbdbdb; 
} 

   .title1 { 
      font-size: 1.3em; 
   } 

   .title2 { 
      font-size: 1.2em; 
   } 

      .title2 a { 
         font-size: 1.1em; 
      } 

      .sidebar .title2 { 
         padding: 0 0 0 12px; 
      } 

.newnav { 
margin: 11px 0 20px 0; 
padding: 0; 
text-transform: lowercase; 
letter-spacing: -1px; 
} 

   .newnav a { 
      font-size: 1.2em; 
      color: d0d0d0 !important; 
   } 

   .newnav a:hover { 
      color: ffffff !important; 
   } 

   .newnav .active { 
      color: ffffff !important; 
   } 

   .newnav li { 
      list-style: none; 
      display: inline; 
      margin: 0 0 0 13px; 
   } 

.sidebar { 
   float: center; 
   width: 200px; 
} 

.content { 
   float: left; 
   width: 500px; 
   padding: 0 0 0 28px; 
} 

.breaker { 
   clear: both; 
   margin-top: 25px; 
   border-top: 1px solid; 
   border-color: 777777; 
   background-image: url(""); 
   background-repeat: repeat-x; 
   height: 200px; 
} 

   .cell { 
      float: left; 
      padding-top: 10px; 
      margin: 0 0 0 25px; 
   } 

   .cell-inner { 
      width: 225px; 
      padding: 0 10px 0 0; 
   }    

.bottoms { 
   clear: both; 
   padding: 45px 0 0 0; 
} 

textarea { 
   background-color: 555555; 
   border: 1px solid; 
   border-color: 666666; 
   color: f0f0f0; 
   padding: 3px; 
   overflow: hidden; 
} 

   input { 
      background-color: 444444; 
      color: f0f0f0; 
      border: 1px solid; 
      border-color: 666666; 
   } 

.askfirst { 
   clear: both; 
   text-align: center; 
   padding: 25px 0 0 0; 
} 
</style> 
<div> 
  <table width="1024" align="center" bgcolor="1a1a1a" height="975" class="main"> 
    <div>
      <div align="center"><strong><font size="7"><br>
<br>
<br>
        <font color="#999999">good stuff here</font></font></strong></div>
</div>

  </table> 
</div> 

Code (markup):