How can you adjust the height of a jQuery UI accordion?

Question

In my UI I have an accordion setup like this:

    
Section 1
    
...content...

    //          


        
      

Answer 1

I recently set up an accordion that retrieves content via ajax when a tab is activated and ran into the same problem. I tried using some of the suggestions posted here, but they never quite grew the panel correctly until I set the heightStyle to content.

$("#myaccordion").accordion({
  heightStyle: "content",
  activate: function(event ui) {
    //use ajax to retrieve content here.
  }
});

I'm using jQuery-UI version 1.10.4.