jquery - IE 9 中的宽度问题，但它在 chrome、IE 7 和 8 中工作正常

Question

JSFIddle here http://jsfiddle.net/cGadk/

在 Chrome 和 IE 7 和 8 中

在 IE9 中

HTML

<div class="container">
<div class="column">
    <a href="#">1</a>
    <a href="#">2</a>
    <a href="#">3</a>
    <a href="#">4</a>
</div>
<div class="column">
    <a href="#">5</a>
    <a href="#">6</a>
    <a href="#">7</a>
    <a href="#">8</a>
</div>
<div class="column">
    <a href="#">9</a>
    <a href="#">10</a>
    <a href="#">11</a>
    <a href="#">12</a>
</div>
<div class="column">
    <a href="#">13</a>
    <a href="#">14</a>
    <a href="#">15</a>
    <a href="#">16</a>
</div>
<div class="column">
    <a href="#">13</a>
    <a href="#">14</a>
    <a href="#">15</a>
    <a href="#">16</a>
</div>

<div class="column">
    <a href="#">17</a>
    <a href="#">18</a>
    <a href="#">19</a>
    <a href="#">10</a>
</div>

CSS

a{
font-size:13px;
font-family : arial;
display : block;
border:1px solid black;
padding : 5px;
}

.column{
    float:left;
}

JS

(function($) {
   var width = 0;

   $('.column').each(function(i, el){
    width += $(el).width();
   });

    $('.container').width(width);
})(jQuery);

Answer 1

.container div 有问题。它对于 IE9 来说太小了。

如果您将 JS 代码从 $('.container').width(width); 更改为 $('.container').width(width+10); 它看起来是正确的。

编辑

我在 IE9 rendering CSS tables differently than Chrome 中找到了对这个问题的很好的解释和一些潜在的修复问题。