怪誕的桌子和墊襯

我覺得這個例子是不言而喻的：http://jsfiddle.net/FLRka/1/怪誕的桌子和墊襯

對我來說，預期的結果是藍色的框應與頁面的頂部停靠，爲什麼會得到一個填充呢？
雖然它沒有得到100px的填充，但是比它少。

下面是從例子的HTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    </head> 

    <body style="margin:0px"> 
     <table style="width:100%; height:100%; border-spacing:0px;" cellpadding="0" cellspacing="0"> 
      <tr> 
       <td style="width:50%"> 
        <div style="height:100px; background-color:red; padding-top:100px;"></div> 
       </td> 
       <td style="width:50%"> 
        <div style="height:100px; background-color:blue;"></div> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

來源

2011-07-17 Nicklas A.