-1
<table>                                        
    <tbody>                                        
        <tr style="height:30px">                              
            <td>Has a Menu and is goes to the extreme left</td>
            <td style="position: absolute; right: 238px;">this cell has a Checkout image and needs to be close to the next cell</td>
            <td style="vertical-align: top; padding-top: 0px; position: absolute; right: 12px;">has another menu and needs to go to the extreme right</td>
        </tr>
    </tbody>
</table>

2番目のTDstyle="position: absolute; right: 238px;"は、最後のTDに基づいてサイズを変更できる必要がありますstyle="vertical-align: top; padding-top: 0px; position: absolute; right: 12px;"。最後のTD/セルは問題なく、正確にその場所にある必要があり、それが私が位置を設定しなければならなかった理由です:絶対....しかし、その前のTDはその前にある必要があります。
2番目のTDでposition:absoluteを削除すると、不要な左側に移動します。そのままにしておくと、最後のTDが減少またはサイズが大きくなり、2番目のTDの画面位置に影響する場合、2番目のTDは常に最後のTDに近い必要があり
ますスタイルを再定義/リファクタリングしてくださいtdの場合はstyle="position: absolute; right: 238px;"

4

1 に答える 1

5

table表形式のデータを表示していないので、私は使用しません。その上、本当に奇妙な音を出すposition:absoluteことは、tdそれが有効であるかどうかさえわかりません(したがって、あるブラウザでは問題ないように見えるかもしれませんが、別のブラウザではそうではないかもしれません。特にIE 7以下ではそうではないので、それを確認することをお勧めします)

代わりに、<div>sを使用して配置すると、簡単になります。何かのようなもの ...

<div style='overflow:auto'>
  <div style='float:left'>Has a Menu and is goes to the extreme left</div>
  <div style='float:right'>has another menu and needs to go to the extreme right</div>
  <div style='float:right'>this cell has a Checkout image and needs to be close to the next cell</div>
</div>

例として、もちろんポジショニングで遊ぶ必要があります。'セル'の3番目が2番目の前にどのように配置されるかに注意してください。これはタイプミスではありません。右にフロートしているため、右端の要素が最初に配置され、次の右にフロートされた要素がその隣で停止します。

于 2012-06-14T20:41:46.467 に答える