Controlling the height of a jQuery accordion in content page I have managed to add a jQuery accordion content page to my Drupal7 site by following the instructions/code given here: http://www.chrisherberte.com/blog/drupal-7-and-jquery-ui-accordion.

However, the height on the drop down fields is not being calculated correctly. Some are too long with lots of white space, others are too short meaning a scroll bar is added to view all the text. It appears to be taking all the heights of each field and using that to calculate an average height which it then applies. 

I have tried the default Bartik theme, as well as my custom theme, functionality is the same on both so not a css issue, but a problem with the jquery itself. 

On top of this, using HTML list elements stops it working all together, and messes up the formatting completely. 



I do not have any idea where or how to edit the Jquery to fix this problem and certainly don't really want to be hacking core.
First you should try to set autoHeight to false , this will fix the height problem.
You should aslo consider to use behaviors in Drupal.

&lt;?php
drupal_add_library('system', 'ui.accordion');
drupal_add_js("
  (function ($) {
    Drupal.behaviors.accordionRoles = {
      attach: function (context, settings) {
        $('#accordion').accordion({
          autoHeight: false
         });
      }
    };
  }(jQuery));
", 'inline');
?&gt;


Then I could find the problem regarding HTML lists, I grabbed your HTML, put it locally and used the demo source for jQuery UI accordion (the section 3 have some HTML list inside) and it seems to work fine.