html tdタグがテーブルの幅を尊重していない

Question

ラッピングのない固定サイズのテーブルを作成できません。私は多くの場所を調べてみましたが、この問題の解決策を見つけることはできません。私は問題と思われるコードを掲載しています。

ここ

はテーブルに私が取得しようとしていますレイアウトです：

<table style="border: 1px solid black; table-layout:fixed; border-collapse:collapse;"> 
 
<tr> 
 
\t <th width="230px" rowspan="3" colspan="1" style="border: 1px solid black;">0 
 
    </th> 
 
    <td width="230px" colspan="6" style="border: 1px solid black;">1 
 
    </td> 
 
</tr> 
 
<tr> 
 
\t <td colspan="3" style="border: 1px solid black;">8 
 
\t </td> 
 
\t <td colspan="3" style="border: 1px solid black;">9 
 
\t </td> 
 
</tr> 
 
<tr> 
 
\t <td width="41" style="border: 1px solid black;">14 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">15 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">16 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">17 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">18 
 
\t </td> 
 
\t <td>19 
 
\t </td> 
 
</tr> 
 
</table>

基本的に

、上記の表では、ボックス0、1、8、9および14 - -18は固定幅、19は他の固定幅に応じてサイズを変更することができます。ただし、このテーブルでは、テーブル全体がlayout:fixedにもかかわらずウィンドウでサイズ変更されます。これは確かにサイズ変更の問題を解決しない

<table style="border: 1px solid black; table-layout:fixed; border-collapse:collapse;" width="460px"> 
 
<tr> 
 
\t <th width="230px" rowspan="3" colspan="1" style="border: 1px solid black;">0 
 
    </th> 
 
    <td width="230px" colspan="6" style="border: 1px solid black;">1 
 
    </td> 
 
</tr> 
 
<tr> 
 
\t <td colspan="3" style="border: 1px solid black;">8 
 
\t </td> 
 
\t <td colspan="3" style="border: 1px solid black;">9 
 
\t </td> 
 
</tr> 
 
<tr> 
 
\t <td width="41" style="border: 1px solid black;">14 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">15 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">16 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">17 
 
\t </td> 
 
\t <td width="25" style="border: 1px solid black;">18 
 
\t </td> 
 
\t <td>19 
 
\t </td> 
 
</tr> 
 
</table>

、今箱14に対して所望の幅 - 19は無視されます。それに対抗するために、私はwidth="460px"含めてみました！これは非常にイライラしており、私はオンラインからたくさんの提案を試みました。これはメールの署名と メールクライアント用ですので、私はハンドルのdivとの互換性を保つためにしようとしているdivを避けるためにしようと

• かなり 不十分
• 私は好まない：

  私の制約のカップル クライアントは、再び以来、異なるメールを入れ子になったテーブルを使用することはかなり 異なる方法

Answer 1

<table style="border: 1px solid black; border-collapse:collapse;" width="460px"> 
 
<tr> 
 
\t <th width="230px" rowspan="3" colspan="1" style="border: 1px solid black;">0 
 
    </th> 
 
    <td width="230px" colspan="6" style="border: 1px solid black;">1 
 
    </td> 
 
</tr> 
 
<tr> 
 
\t <td colspan="3" style="border: 1px solid black;">8 
 
\t </td> 
 
\t <td colspan="3" style="border: 1px solid black;">9 
 
\t </td> 
 
</tr> 
 
<tr> 
 
\t <td width="41px" style="border: 1px solid black;">14 
 
\t </td> 
 
\t <td width="25px" style="border: 1px solid black;">15 
 
\t </td> 
 
\t <td width="25px" style="border: 1px solid black;">16 
 
\t </td> 
 
\t <td width="25px" style="border: 1px solid black;">17 
 
\t </td> 
 
\t <td width="25px" style="border: 1px solid black;">18 
 
\t </td> 
 
\t <td width="auto">19 
 
\t </td> 
 
</tr> 
 
</table>

Answer 2

のインラインブロック/浮動要素を扱うように見えます試してみてください。style = "max-width：41px"はおそらく動作します。