Search code examples
csstwitter-bootstrapaccordionhorizontal-accordion

Bootstrap accordion horizontal (inline-block) - collapse issue

I have bootstrap accordion at the website, which is positioned horizontally (inline-block panels)

Bootply - code

The problem occurs when I try to open text panel below the image, because all three other panels scroll to the bottom of accordion panel group. Example - screenshot1 screenshot2...

Can you please help me how to fixed all panels to top when open any of panels body text?

When I change .panel-default style to position: absolute; All four panels appear over each other Live example here - http://www.twodotsmedia.com/u-izradi/uram-system/usluge.php

Solution

  • Just add following css:

    .panel-default {
    vertical-align: top;
}

    Its better to always use vertical-align property with display: inline-block explicitly.