Td class, very confusing, larger number reduces width?

This is not a problem as such, but I would like to know what is happening, so I can understand it. I am currently coding a new website that has required me to use a single table in the design footer. (I don't use them often, but this table just makes life easier for this project.)

I use the CSS class for td tables, with the only element being width:%; but for some reason I just can't figure it out, increasing% from 10% to 20% actually makes td smaller in width. completely back.

I'm really stumped by this, can anyone explain this?

Greetings

HTML:

<div class="footertable">
<table border="2">
<tbody>
<tr>
<td valign="top" class="footer">
<div class="footerheading">SHOPPING</div>
</td>
<td valign="top" class="footer">
<div class="footerheading">CUSTOMER SERVICE</div>
</td>
<td valign="top" class="footer">
<div class="footerheading">PAYMENT OPTIONS</div>
</td>
<td valign="top" class="footer">
<div class="footerheading">SOCIAL</div>
</td>
<td valign="top" class="footer">
<div class="footerheading">ORDER</div>
</td>
</tr>
</tbody>
</table>
</div>

CSS

.footertable { margin:auto; max-width:1080px;}
td.footer {width:10%;}​

Notes:

+5
2

10 20% .

( DIV) :

http://jsfiddle.net/BPygA/2/

, . , , , , , (. ).

, , 10% , .

, 5 . 10% 50%. , , , 50%, .

@Jacob, W3 ( ), , .

HTML . UA "table-layout" - ""; .

UA , .

. "width: auto", , UA . (, : "110%", .)

http://w3.org/TR/CSS2/tables.html#propdef-table-layout

.

+1

, , . , , , . :

  • -: ​​
  • ( )
  • ?
  • colgroup?
  • ?
  • - ?

.

, . , . , .

, 100%, undefined.

, .

+1

All Articles