Учитывая этот пример (http://jsfiddle.net/A8gHg/, код ниже), попробуйте сделать ваше окно меньше, чтобы размер примера был сплющен.
<div style="background-color:blue">
<table style="width:100%">
<tr>
<td>
<input type="text" style="width:150px"/>
</td>
<td>
<input type="text" style="width:150px"/>
</td>
<td>
<input type="text" style="width:150px"/>
</td>
<td>
<input type="text" style="width:150px"/>
</td>
<td>
<input type="text" style="width:150px"/>
</td>
</tr>
</table>
</div>
Вы заметите, что текстовые поля (правильно) не переносятся на новые строки, поскольку они находятся в отдельных <td>
s.
Однако содержащее div
, обозначенное синим цветом, не полностью завершает таблицу.
Как сделать, чтобы содержащее div
полностью содержало дочерний элемент table
?