October Blue a small design and communications firm

Firefox getComputedStyle Table Margin Bug

There’s a bug in Firefox when computing table margins using getComputedStyle; it always returns 0px. See the test case.

The bug also effects current versions of Firebug (case 171, as well as YUI’s getStyle method (my library of choice.)

Thankfully, there’s a workaround. While technically you could alter the display property of your table to ‘block’, you’ll probably find that to be less than ideal in most situations. A more graceful approach, if subtly less performant, is to clone the table and obtain the desired measurement from the clone. (Note: It is not necessary to perform a deep clone.)

View the workaround.

Update (4/2/2008):

I posted an inquiry to this bug on the ydn-javascript mailing list hoping to gain some insight from the the yui team. Matt Sweeney (author of Dom, Selector, and Animation—to name a few) rose to the occasion and did a little research into the issue. He found that while this bug is fixed in the latest build of Firefox 3, that apparently Opera and Safari diverge from Firefox in their interpretation of CSS2 Specification and that “perhaps some clarification is needed here for the sake of x-browser consistency.”

By the way, Matt’s response is one of the reasons it’s worth being a member of the ydn-javascript mailing list even if you don’t work with yui on a daily basis. Granted, you’ll have to dig through a lot of posts that might be irrelevant to you, but every now and again you come across a gem of insight which might help you become a better developer.