jQuery .width() and .height() strange behaviour

There are a few jQuery methods for calculating height and width. Try using outerHeight()

Excerpt from jQuery Docs: http://api.jquery.com/outerHeight/

.outerHeight( [ includeMargin ] )

includeMargin - A Boolean indicating whether to include the element's margin in the calculation.

http://api.jquery.com/innerHeight/

.innerHeight()

This method returns the height of the element, including top and bottom padding, in pixels.

Edit: Setting height() on the td-element is adjusted to include the default padding (1px). The computed dimensions of are actually...

_{(source: wordofjohn.com)}

You should set the default padding to 0px to avoid these issues.

table td {
    padding: 0;
}

Edit 2: It appears to be a browser issue (probably something related to the rendering engine's method of calculating a table's dimensions). The effects of this behavior will vary across browers. You should find an alternate, table-less, solution using divs.