0

I have a simple div tag: I need to make the thead fixed and above the tbody. I need to have them within the same div, same table. With the below code, my header is over the body. How Can I push the tbody down a few notches, so when i scroll the header is fixed and only the body moves

<div STYLE=" height: 120px; width: 100px; font-size: 12px; overflow: auto;">
  <table bgcolor="green">
    <thead style="position:fixed;">
        <tr><td bgcolor="#fafafa">hello</td></tr>
    </thead>
    <tbody >
   <tr><td bgcolor="#dadada">www.hioxindia.com</td></tr>
   <tr><td >maths.hscripts.com</td></tr>
   <tr><td bgcolor="#dadada">www.hscripts.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   </tbody>
</table>
</div>

Has to work on IE For the above div... I need to add scroll with fixed header on top of the table. No additional divs or table should be included inbetween. I need the thead and tbody to be within the same table

4

2 に答える 2

2

あなたのコードを基礎として使用して、ここに私が Chrome と IE10 でテストした jsfiddle があり、少なくともそこで動作します。

JSFiddle: http://jsfiddle.net/YbQzF/

コード：

<div STYLE=" height: 120px; width: 100px; font-size: 12px; overflow: auto;">
  <table bgcolor="green">
    <thead style="position: fixed">
        <tr><td bgcolor="#fafafa">hello</td></tr>
    </thead>
    <tbody style="overflow:scroll; max-height:100px; position:absolute; top:20px;">
   <tr><td bgcolor="#dadada">www.hioxindia.com</td></tr>
   <tr><td >maths.hscripts.com</td></tr>
   <tr><td bgcolor="#dadada">www.hscripts.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
...
   </tbody>
</table>
</div>​
于 2012-11-19T21:48:34.207 に答える
0 
table { margin-top:-3em; }
thead { margin-top:-2em; }

コンピューターの FF と Chrome で動作します。それは恐ろしくハックであり、私はこのメッセージを承認しませんが、機能します.

于 2012-11-19T20:36:14.150 に答える