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

In your jquery-ui.js search for the following section and change heightstyle: "auto" to heightstyle: "content" so the updated file will look like this.

var accordion = $.widget( "ui.accordion", {
  version: "1.11.4",
  options: {
    active: 0,
    animate: {},
    collapsible: false,
    event: "click",
    header: "> li > :first-child,> :not(li):even",
    heightStyle: "content",
    icons: {
        activeHeader: "ui-icon-triangle-1-s",
        header: "ui-icon-triangle-1-e"
    },

    // callbacks
    activate: null,
    beforeActivate: null
},