Topic: Multiple popouts in one page

zyrus pro asked 7 years ago

I'm having trouble showing multiple popouts in one page. Since I have to use the "accordion" ID more than once, the panels don't collapse properly as expected. Any workaround on this?

Michal Szymanski staff answered 7 years ago

Hi, just set an unique ID (example: <div id="collapse113" class="panel-collapse collapse"> ) an appropriate href attribute (example: <a data-toggle="collapse" href="#collapse113"> ) for each single panel.
<div class="panel panel-default">
    <a data-toggle="collapse" href="#collapse113">
        <div class="panel-heading">
            <h4 class="panel-title">
Collapsible panel
    <div id="collapse113" class="panel-collapse collapse">
        <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.


Specification of the issue

  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No