Getting the height of a div

<span style="width:100%" id="learning_menu"><div id="aLM" style="width:100%;height:100%">test | test | test</div></span>

The code above is the current HTML that I have. I'll be making the inner "div" shrink-and-grow using jQuery. I can't figure out how to get the heigh开发者_如何学JAVAt of the span/div though. I'm not going to set a specific value in CSS because it could change depending on the browser. Because of this, my JavaScript (style.height) always returns 0.

Any ideas?

Here it is in plain js and no jQuery required:

document.getElementById("learning_menu").offsetHeight;

Using jQuery: that would be the .height() method.

var span_height = $('#learning_menu').height(),
    div_height = $('#aLM').height();

N.B. it is invalid HTML to place a block-level element (in this case the <div>) inside of an inline element (the <span>).

Hm. I am not sure wither I’ve got your issue right or not but… From pure javascript you can use clientHeight (or offsetHeight) property of the element to get it’s height in pixels. From jquery just use .height() method (wich is actually a browser-agnostic wrapper around clientHeight property).

$("#learning_menu").height() will return the span's height