jquery - innerHeight() が IE 9/10 で間違った高さを返す

Question

奇妙な IE の動作を理解する助けが必要です。2 つの div があり、1 つは隣り合っています。div の 1 つにはテキストがあり、もう 1 つは空です。空の div の高さを設定して、div とテキストを一致させたいと考えています。空の div の高さを、テキストを含む div の .innerHeight() に設定しても、IE9/10 では機能しません (新しい高さは本来よりも 1 ピクセル大きく、IE8 は正常に機能します)。これに対するクロスブラウザ ソリューションはありますか?

html:

<div class="container">
    <div class="row" id="left">foo</div>
    <div class="row" id="right"></div>
</div>

CSS:

.container { width: 200px; }
.row { font-size: 11px; font-weight: bold; color: #666; float: left; width: 100%;  border-bottom: 1px solid #ddd; position: relative;}
#left { background-color:yellow; width: 50%; }
#right { background-color:lightblue; width: 50%; }

js:

var $right = $("div#right"),
    $left = $("div#left")
;

$right.css({
    height: $left.innerHeight()
});

ここにフィドルとIE10のスクリーンショットがあります