How can you adjust the height of a jquery UI accordian?

Posted by KallDrexx on Stack Overflow See other posts from Stack Overflow or by KallDrexx
Published on 2010-05-15T17:37:25Z Indexed on 2010/05/15 17:44 UTC
Read the original article Hit count: 234

Filed under:
|
|
|

In my UI I have an accordian setup that so far functions

<div id="object_list">
    <h3>Section 1</h3>
    <div>...content...</div>

    // More sections
</div>

The accordian works properly when it is first formed, and it seems to adjust itself well for the content inside each of the sections. However, if I then add more content into the accordian after the .accordian() call (via ajax), the inner for the section ends up overflowing.

Since the accordian is being formed with almost no content, all the inner divs are extremely small, and thus the content overflows and you get accordians with scrollbars inside with almost no viewing area.

I have attempted to add min-height styles to the object_list div, and the content divs to no avail. Adding the min-height to the inner divs kind of worked, but it messed up the accordian's animations, and adding it to the object_list div did absolutely nothing.

How can I get a reasonable size out of the content sections even when there is not enough content to fill those sections?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about jquery-ui