chrome 6的jquery边距问题答案

【问题标题】：jquery margin problem with chrome 6chrome 6的jquery边距问题
【发布时间】：2010-09-06 15:28:27
【问题描述】：

我对 jquery (1.4.2) 和 chrome 6 有疑问

margin-left:auto
margin-right:auto

$(id).css('margin-left');
$(id).css('margin-right');

两者都返回一个像素值（例如：327px）

【问题讨论】：

其他浏览器返回“auto”（FF、IE、Opera）
下一次，做更多的事情，比如jsbin.com/uhuta3，这样我们可以更好地帮助你，不要我们什么都做，尽你所能得到一个快速而尖锐的答案

标签： jquery css google-chrome

【解决方案1】：

这是因为在指定 margin:auto 时，Chrome（以及 Safari，因为它们都使用 WebKit）将 margin-left 和 margin-right 的计算值设置为相同大小的使用值。

而 Firefox 和 IE 将 margin-left 和 margin-right 的计算值设置为 0px。因此，如果您有一个 1000px 宽的页面，并且您的元素占用 50% 的宽度（即：500px）并且具有 margin:auto，那么 Chrome 会将元素的 margin-left 和 margin-right 的计算值设置为 250px（因此它会填充所有空白元素的边框边缘和其父元素的内容边缘之间的空间，带有边距，因此水平居中元素）。

但是，Firefox 和 IE 会将 margin-left 和 margin-right 的计算值设置为 0px，因此元素的边框边缘与其父元素的内容边缘之间没有边距，但仍然居中。您实际上可以使用 Firefox 中的 Firebug 和 Chrome 中的开发人员工具看到它发生。深入的解释可以在这里找到：

http://www.3d3r.com/simon/marginAutoComputedValue

来自 smnh 在jQuery position page下回答

请记住，您可以使用 .position() 和 .offset() 对尺寸进行更多控制

$(id).position().left

或者你真的想要MarginLeft 吗？

【讨论】：

我需要获取边距值才能在元素周围绘制边距框。有没有其他的计算方法？
你有元素尺寸（大小）和偏移量（从边框），这很容易做到！