I've done quite a few web UI changes, including CSS styles and javascript testing in IE. Now I have to ensure, that it also work in FioreFox.
innerText
Thanks to Damian Edwards who pointed another FireFox incompatibility bug in our javascript code:
The line in javascript causing the issue easily figured out using Firebug.
The elem.innerText property is an IE proprietary addition and thus not usually supported by other browsers. Instead you should be getting the “inner text” of the cell using something like the following:
elem.firstChild.nodeValue;
This uses W3C DOM compliant properties to retrieve the text value of the first TextNode of the cell. This makes it more likely to work across browsers.
Width in IE and Firefox treated differently.
According to
standard (that FireFox follows), content width is set excluding paddings and border(see
figure there).
"The size of the box is the sum of the element width (i.e. formatted text or image) and the padding, the border and the margin areas".
But in IE the width of the box is the width of the content plus any border or padding.
In other words:
width(IE)="padding-left"+"border-left"+ width(FF) + "padding-right"+"border--right".
To make IE to follow standard can be done by specifying
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
or
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
Unfortunately, this change will have MAJOR impact on existing web site. In our application we effectively have one page with different user controls loaded dynamically, so the change will effect everything -too risky.
Class and ID Names are Case Sensitive in FireFox
Different Tools.