jQuery outer height is zero?

Question

Why is the height of my search form 0? It's at least 20px high.

jQuery(function($) { // Document ready
    var s_height = $("#search_form").outerHeight(); // Height of searchform
    alert(s_height) // 0

Answer 1

With jQuery you can only get the height of an element if it is visible. So make sure that it is visible at the time that your JS runs, or use one of the several workarounds if you need it to be hidden at the time.

As you mentioned in your comments, the div was hidden and then fading in.

Answer 2

If search_form contains floats, try overflow:hidden; on it. If it contains images, try $(window).load(function(){ /* code */ }).