Horizontal accordion div goes down when reducing the window size

Question

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>

Answer 1

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; }

Answer 2

It's because wrapper div automatically shrink when you reduce window's size. Set width on wrapper.

.accordionWrapper { width: 689px; }