IEで移動する部署

Question

私は2つの列を持つテーブルを持っています。左の列には何らかのコンテンツがあり、唯一の浮動要素であるウィジェットdivがあります。このdivは、ページが読み込まれたときにテーブルの右の列を持ってページの一番下に移動し続けます。時には、私は何かを動かすと、それは完全にランダムであるように見える。

IEのpeek-a-booバグのようですが、それほどではありません。私はposition: relative;を試しましたが、動作しません。何か案は？ここで

は、HTMLです：

<table class="formTable"> 
    <tr> 
     <td class="content_main"> 
      <h1>header</h1> 
      <table> 
       <tr> 
        <td>Content here</td> 
        <td>Content here</td> 
       </tr> 
      </table> 

      <div style="float: left; clear: none; display: block; color: rgb(68, 68, 68); font-weight: normal; font-family: &quot;Trebuchet MS&quot;,&quot;Verdana&quot;,sans-serif; font-size: 14px; line-height: 18px; text-decoration: none; text-align: left; margin: 0px; padding: 10px; height: auto; width: auto; background-image: none; background-color: white; border: 10px solid rgb(204, 204, 204); overflow: auto;" id="widget"> 
       Content 
      </div> 
     </td> 
     <td class="content_right"> 
      <ul> 
       <li>List</li> 
       <li>List</li> 
      </ul> 
     </td> 
    </tr> 
</table> 

そして、ここでは、テーブルのCSSです：

.content_right { 
    padding-left: 20px; 
    padding-top: 15px; 
    width: 393px; 
} 
.content_main { 
    padding-top: 15px; 
    width: 500px; 
} 

Answer 1

は私のために正常に動作します。 divを使用する方法がわかっている場合は、テーブルを避けてください。

Answer 2

 <h1>header</h1> 
     <article>Content here</article> 
     <article>Content here</article> 

     <div id="widget"> 
      Content 
     </div> 
     <ul> 
      <li>List</li> 
      <li>List</li> 
     </ul> 

このようにHTMLを試し、インラインBLOBの代わりにCSSスタイルシートを使用してください。基準は理由のために作られています。これまでのところ、最近のすべてのブラウザがそれらをサポートしているので、厄介なマークアップやそれが引き起こす「バグ」の必要はありません。資料を読むにはhttp://www.abookapart.com/を参照してください。