Search code examples
jqueryaccordionhorizontal-accordion

Horizontal accordion div goes down when reducing the window size


I am using a horizontal accordion based on this website:

http://www.marghoobsuleman.com/mywork/jcomponents/accordion-common/accordion.html

If you reduce the window size the accordion will wrap down; it will not fit inside the window.

Expected :

 <div></div> <div></div> <div></div>

On a large window size this works fine, but on reducing window size, it will display like this:

 <div></div>
 <div></div>
 <div></div>

Solution

  • To prevent the divs from wrapping, you would really need to wrap the accordion itself in an element with defined width.

    Add this to your CSS:

    .accordionWrapper { width: 689px; }