tdタグ内のテーブルはtdタグを伸ばしています

Question

私はパーセンテージで指定された幅を持つ4列のテーブルを持っています。例えば。 td width = "25％"、幅100％のテーブル。他のテーブルが列の中にないときに幅が完全に機能するようになりました。特定の幅のtdタグ内に次の表を追加すると、パーセントが自動的に増加します。

<td width="25%"> 
<table cellspacing="0" cellpadding="3" border="1"> 
<tbody> 
<tr> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
</tr> 
<tr> 
<tr> 
<tr> 
</tbody> 
</table> 
</td> 

私は、列の問題の延伸をソートしますが、テーブル

<div style="max-width: 100px !important; "> 
<table cellspacing="0" cellpadding="3" border="1"> 
<tbody> 
<tr> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
</tr> 
<tr> 
<tr> 
<tr> 
</tbody> 
</table> 
</div> 

を含むdivタグをオーバーフローしdivタグに上記の表を追加しようとしたどのような方法が存在するように内部テーブル指定されたtdタグ幅は自動的に幅を継承し、制御しません。私はまた、列内のテーブルの幅を指定しようとしましたが、それも動作しませんでした。

Answer 1

境界線と埋め込みによって、要素が表示されるよりも大きくなることがあります。 たとえば、width: 100pxのdiv内にあるwidth: 100%; border-width: 1pxの表は、境界線のピクセル幅のため実際には102pxを内側に収めようとします。

これに関する詳細については、あなたが閉じていないタグを持っているのでIE box model bug

Answer 2

がそれを見ていませんか？

<td width="25%"> 
<table cellspacing="0" cellpadding="3" border="1"> 
    <tbody> 
     <tr> 
      <td style="text-align: center;">text</td> 
      <td style="text-align: center;">text</td> 
      <td style="text-align: center;">text</td> 
      <td style="text-align: center;">text</td> 
      <td style="text-align: center;">text</td> 
     </tr> 
     <tr> 
      <tr> 
        <tr> 
</tbody> 
</table> 
</td> 

私はすべてのコードをコピーしていなかったので、それはないです

<td width="25%"> 
<table cellspacing="0" cellpadding="3" border="1"> 
<tbody> 
<tr> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
<td style="text-align: center;">text</td> 
</tr> 
<tr> 
    <td colspan="5">&nbsp;</td> 
</tr> 

</tbody> 
</table> 
</td>