诡异的问题，Select填充OPTION时，宽度自动变短

Question

代码很简单，如下，点按钮时，给select添加一个Option，然后Select的width就一直变短……
如果Width设置为固定长度，就没有问题，设置成百分比，就是不行
求解决方案：
<script>
    function a11(){
        var obj = document.getElementById('lst1');
        var opn = document.createElement("OPTION");
        opn.innerText = 11;
        opn.value = 11;
        obj.appendChild(opn);
    }
</script>
<table style="width:500px;">
    <tr>
        <td style="width:100%;">
            <select id="lst1" style="width:95%;">
                <option>1</option>
            </select>
            
        </td>
    </tr>
</table>
<input type="button" value="show" onclick="a11();">

Answer 1

把你相关的其他代码发来看看, 如果仅仅是这些代码, 那真是诡异了...
我测了IE8, IE6都没有问题.

Answer 2

我测试了2台IE6，没问题
测试了2台IE8、1台IE7，都会自动变短代码就上面这些。

Answer 3

换言之，我这边的IE7和IE8，都有这个问题
不知道2楼的IE8为啥没问题。

Answer 4

// 问题不明 不知道是BUG不
    function a11(){
        var obj = document.getElementById('lst1');
       /* var opn = document.createElement("OPTION");
        opn.innerHTML = 11;
        opn.value = 11;
        obj.appendChild(opn);*/
        obj.options.add(new Option('11','11'));
    }

Answer 5

唉 又是这个错误 自己写被蒙了. 追加DOM要先追加 后设置属性..   var obj = document.getElementById('lst1');
        var opn = document.createElement("OPTION");
    obj.appendChild(opn);
        opn.innerHTML = 11;
        opn.value = 11;

Answer 6

多谢楼上的兄弟，原因是为啥呢？
我用currentStyle检查width和parentNode的width都没变
就是龟腚？

Answer 7

应该是 每次设置属性 导致reflow了吧 我只是这么理解的.