[mootools]theadやtbodyのfloat:leftがIEで効かないので

それじゃあタグ変えて中身をtableの外に出せばいいんじゃん。(そしたらfloatできるじゃん)
…という発想から出来たソース。mootools使用。
※このサンプルは前バージョン(1.1.2)で書いたものなので1.2では動かないかも

IEはthead、tbody、tfootへのfloat、positionが効かない。
効果的なハックがあればいいんだけど見つからなかった。
つくづくIEはダメな子だな。

※親にID=sampleが振ってあるという前提で

<table border="0" cellspacing="0" cellpadding="0">
<thead>
<tr><td colspan="2">
<p class="image">
<img src="images/sample.jpg" alt="サンプル" width="180" height="135" /><br /><small>サンプル</small></p>
</td></tr>
</thead>
<tbody>
<tr>
<th scope="row">サンプル</th>
<td>サンプル</td>
</tr>
</tbody>
</table>

theadのpをtableの前に配置し、空になったtheadを消す。

▼実行後ソース

<p class="image">
<img src="images/sample.jpg" alt="サンプル" width="180" height="135" /><br /><small>サンプル</small></p>
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<th scope="row">サンプル</th>
<td>サンプル</td>
</tr>
</tbody>
</table>

if($(‘sample’)&&window.ie){
var thead =$$(‘thead’);
var table =$$(‘table’);
for(i=0;i

Leave a Comment.