Таблица в td tag stretches td tag

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 тег, содержащий таблицу

<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> 

Есть ли способ, так что таблица внутри ширина td-метки, указанная widht, автоматически наследует ширину и не контролирует ее? Я также попытался указать ширину таблицы внутри столбца, а также не работал.

Answer 1

Границы и отступы могут привести к тому, что элементы будут больше, чем они появляются. Например, таблица width: 100%; border-width: 1px внутри div с width: 100px на самом деле попытается вместить 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>