[jQuery] Document.ready

[jQuery] Document.ready

I'm having a weird problem with $(document).ready where it seems that some of the CSS loads after the $(document).ready.
Specifically, I have a call to $("#navbar, #contentBox").equalizeColumns(); in my $(document).ready. $.equalizeColumns is defined as:
    jQuery.fn.equalizeColumns = function(){
    var m = 0;
    return this.each(function(){
      if((h = parseInt($(this).css('height'))) > m) m = h;
    }).css("height", m + "px");
  };
in my $(document).ready. The height it returns in $(document).ready is different than the height it returns in Firebug if I comment out the call and call $("#contentBox").css("height").
<br clear="all">
The relevant css is:
<span style="font-family: courier new,monospace;">#navbar {</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  float:               left;
</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  margin-top:          -2px;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">
  margin-right:        10px;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  height:              100%;    </span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">
  width:               181px;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  padding-top:         10px;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">
  border-right:        3px ridge #fff;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">}</span><br style="font-family: courier new,monospace;"><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">#contentBox {</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  float:               left;</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">  overflow:            visible;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  margin-top:          0;</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">  width:               600px;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">  height:              auto;</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">}</span>
I also have an element floating inside #contentBox as follows:
<span style="font-family: courier new,monospace;">#studio_img {</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">    float:             right;</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">}</span>
It looks like it's getting the height of #contentBox before the #studio_img float (and corresponding increase in the size of #contentBox) is calculated. Anyone have any ideas?
--
Yehuda Katz
Web Developer
(ph)  718.877.1325
(fax) 718.686.4288
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/