Firefox中的Jquery没有正确报告border-bottom-width属性 [英] Jquery in Firefox not reporting border-bottom-width property correctly

问题描述

我正在使用JQuery以编程方式更改border-bottom-width，这可以正常工作。但是，当使用JQuery重新读取属性时，我会跨浏览器获得不一致的结果。例如，

 < td style =border-bottom：30px solid rgb（199,72,72）; line-身高：1px;字体大小：1px;> 
  

当使用以下方式通过Jquery查询时：

<$ p 。$ p> $（ '＃元素1'）找到（ 'TD'）的CSS（ '下边框宽度'）;


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

在这里展示一个小提琴：

I'm programmatically changing the border-bottom-width using JQuery, which works fine. However, when reading the property back using JQuery I get inconsistent results cross-browser. For instance,

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

When interrogated via Jquery using:

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

In Chrome (version 33.0.1750.154 m) returns 30px, but in Firefox (version 28.0) and IE11 returns 15px.

Demonstrated in a fiddle here: http://jsfiddle.net/ceepster/tC9an/

The border width renders correctly in the browser

Anyone got any thoughts as to why this is and any workarounds I can use to get this reporting reliably cross-browser?

解决方案

As @Allyanora, I'm trying to describe why it might be happening:

As different browsers apply display property for the td element differently, you need to apply the display property with block value. See the following picture for clear view:

working fiddle

这篇关于Firefox中的Jquery没有正确报告border-bottom-width属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！