html - 境界線で他の2つに囲まれた固定サイズのセル

Question

次の特性のテーブルを作成する必要があります。

__ _ __ _ __ウィンドウ幅の100％_ __ _ __ _ _

| 自動幅| 幅860ピクセル、境界線| 自動幅、境界線

---

つまり、860pxの中央に配置されたセルが、両側で他の1つのセルに囲まれているということです。右側のセルにも境界線を設定する必要があります。

すべての（古いIE6でさえ）ブラウザに優しいものを思いつくことはできません。互換性は私にとって重要です。それがテーブルなのか、divの束なのかは気にしません。あなたはなにか考えはありますか？

ありがとう

Answer 1

この非常にquirksmodeのマークアップについては申し訳ありませんが、あなたが説明したことを実行しているようです。

編集：テーブルを追加-レイアウト：テーブル用に修正、中央のtd用にwidth = "860"：

<style type="text/css">
table{ table-layout: fixed; }
.w860{ width:858px; }
.brdr{ border-style:dashed; border-width:1px; }
.td860{ background-color:#eee; }
</style>

<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
    <td><div></div></td>
    <td width="860" class="td860">
        <div class="w860 brdr">
            content
        </div>
    </td>
    <td>
        <div class="brdr"> also some content</div>
    </td>
</tr>
</table>

FF、IE6 +（quirksmodeおよびstandards）、SafariforWindowsでテスト済み。

Answer 2

<style>
table{
width:100%;
}
 .auto{
width:auto;
}
.fixed{
width:860px;
}
.bordered{
border: 1px #ff0000 dashed;
}
</style>

<table>
<tr>
<td class="auto">11&nbsp;</td>
<td class="fixed">111&nbsp;</td>
<td class="auto bordered">111&nbsp;</td>
</tr>
</table>