Firefox 中的 Jquery 未正确报告border-bottom-width 属性答案

【问题标题】：Jquery in Firefox not reporting border-bottom-width property correctlyFirefox 中的 Jquery 未正确报告border-bottom-width 属性
【发布时间】：2014-04-08 19:25:06
【问题描述】：

我正在使用 JQuery 以编程方式更改边框底部宽度，效果很好。但是，当使用 JQuery 读取属性时，跨浏览器的结果不一致。例如，

<td style="border-bottom: 30px solid rgb(199, 72, 72); line-height: 1px; font-size: 1px;">

当使用 Jquery 询问时：

$('#element1').find('td').css('border-bottom-width');

在 Chrome（版本 33.0.1750.154 m）中返回 30px，但在 Firefox（版本 28.0）和 IE11 中返回 15px。

在这里演示：http://jsfiddle.net/ceepster/tC9an/

边框宽度在浏览器中正确呈现

任何人对为什么会这样以及我可以使用任何解决方法来获得可靠的跨浏览器报告有任何想法吗？

【问题讨论】：

我在 Firefox 中看到 15！
解决方法是$('#result').html('The border-bottom-width is: ' + $('#element1').find('td:first')[0].style.borderBottomWidth);
我不确定为什么会发生这种情况，但是如果您在该 td 上应用样式“display: block”，它会正确呈现。
感谢 Aamir - 看起来效果不错！

标签： jquery css firefox internet-explorer-11

【解决方案1】：

作为@Allyanora，我试图描述它为什么会发生：

由于不同的浏览器对td元素应用显示属性的方式不同，您需要应用带有块值的显示属性。看下图清晰可见：

working fiddle

【讨论】：