webkit中设置align为center的div中的table会自动产生外边距magin,用js改变margin将不起作用
该现象重现代码如下:
?
<!DOCTYPE HTML><HTML> <HEAD> </HEAD> <BODY> <div align="center" style="width:500px;border:1px solid gray;"><table id="a" style="width:100px;background:gold;"><tr><td>table</td></tr></table> </div> <p><input type="button" value="modify table margin" onclick="modify()"/> </p> <script>var i = 0;function modify(){ i = i + 100;var obj = document.getElementById('a');obj.style.marginLeft = i+'px';} </script> </BODY></HTML>?
?
当点击按钮modify table margin时,函数modify会修改talbe的margin,以下是各浏览器的表现
?
IE/Firefox/Opera : 每点击一次都会移动100px
?
Safari/Chrome : 点击后不移动
?
当利用修改margin来实现图片滚动的效果webkit浏览器中将失效。
?
?
把父元素div的align属性删掉或align=left都不会重现该bug。
?
?
?