2016-01-10 4 views
4

У меня проблема с созданием таблицы без полей и ячейками той же ширины.Проблема с форматированием с размером таблицы HTML

Чтобы проверить это, я установил фон стола красным, а фон ячейки - зеленым. Всегда отображается часть фона таблицы.

Любые идеи о том, как сделать его того же размера?

<table style="background-color:red; border-collapse:collapse; border:10px; width:550px;"> 
    <tbody> 
     <tr> 
      <td style="background-color: green; color:white; width:100%;">can't get rid of red bit<td> 
     </tr> 
    </tbody> 
</table> 

ответ

4

<table style="background-color:red; border-collapse:collapse; border:10px; width:550px;"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="background-color: green; color:white; width:100%;">can't get rid of red bit 
 
     <td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<hr/> 
 
<table style="background-color:red; table-layout: fixed; border-collapse:collapse; border:10px; width:550px;"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="background-color: green; color:white; width:100%;">No more red bit, YOU ARE VICTORIOUS!!!</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

table { table-layout: fixed; } 

или

<table style="table-layout: fixed;"> 

Подробности: https://css-tricks.com/fixing-tables-long-strings/

2

Далее @ zer00ne, вы можете установить р добавление к 0 (если вы можете)

td { 
 
    padding:0; 
 
}
<table style="background-color:red; border-collapse:collapse; border:10px; width:550px;"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="background-color: green; color:white; width:100%;">can't get rid of red bit<td> 
 
    </tr> 
 
    </tbody> 
 
</table>

http://output.jsbin.com/suzizo