我有一个包含展开组件的 Bootstrap 网格。
我的实际问题是,当我展开一列时,其他列会移动,因为它们在同一行中。
我想知道如何使列相互独立
展开组件
<p>
<button type="button" class="btn btn-outline-primary" (click)="isCollapsed = !isCollapsed"
[attr.aria-expanded]="!isCollapsed" aria-controls="collapseExample">
Toggle
</button>
</p>
<div id="collapseExample" [ngbCollapse]="isCollapsed">
<div >
<div class="">
You can collapse this card by clicking Toggle
</div>
</div>
</div>
应用组件(容器)
<div class="row">
<div *ngFor="let card of cards; let index=index" class="col-4 col-sm-4 col-xl-4">
<app-expend></app-expend>
</div>
</div>
这是发生了什么
这是我的期望
这是一个 example来说明我的实际问题
最佳答案
Accordion 是您需要的吗?检查这个例子, https://getbootstrap.com/docs/4.0/components/collapse/#accordion-example
关于html - 在 Bootstrap css 网格中展开列移动其他列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55007478/