title: td within a tr in Chrome is off by 4 pixels in width
body: <p>If you use this code in Chrome, you get a td with the number 4 in it, indicating the width of the td is 4 pixels smaller than the tr.  If you do it in Firefox, you get 0.  If you add "display:block" to both of the css definition, it changes to 0.  My question is, where in the world is Chrome getting the 4 extra pixels from?</p>
  
  <p><a href="http://jsfiddle.net/te4L9/8/" rel="nofollow">Demo here.</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;table&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
          &lt;td&gt;Hey&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>JS (with jQuery):</p>
  
  <pre><code>jQuery(document).ready(
  function () {
      var td = $("td");
      var tr = $("tr");
      td.text(tr.width() - td.width());
  });
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>tr{
    background-color:red;
  }
  td {
    padding:0px;
  }
  </code></pre>