Firefox element height issue

Question

I am creating a table dynamically based on the number of rows returned from the server using struts. The table is created properly and I am trying to get the height value on the created table using any of the following:

document.getElementById('elementId').offsetHeight
jQuery("#elementId").css('height')
jQuery("#elementId").height()

I have run my code using Chrome and they all return the proper height of the table. The issue I am having is with Firefox. Any of these run with Firefox is always returning a value of 0.

I have tried placing the code in a $(document).ready(), $(window).load(), and in a window.load = function(){} call, but none of them are returning a value. When I run the code in Chrome it returns a value of 136 for the height and when I run the same code in Firefox, it returns a value of 0 every time.

Is there something I am missing? Any help would be greatly appreciated.

Answer 1

try wrapping the table in a div and get the height of the div.

Answer 2

It may be a case of how your setting the size on you table dynamically.

Try either of the following:

alert(document.getElementById("myElement").clientHeight);

alert(document.getElementById("myElement").style.height);

Answer 3

Moin is on to something - I had to wrap a table in a DIV to get its height. But if your next step is to SET the height this won't work in FF:

$("#ID").height(123)

You need to do this instead

$("#ID).css("height", 123)

NO idea why.