Развернуть столбец внутри Bootstrap css grid сдвигает другие столбцы - PullRequest
1 голос
/ 05 марта 2019

У меня есть сетка начальной загрузки, которая содержит компонент расширения.

Моя настоящая проблема заключается в том, что когда я раскрываю один столбец, другие столбцы сдвигаются, потому что они находятся в одной строке.

Я хотел бы знать, как сделать так, чтобы столбцы зависели друг от друга

развернуть компонент

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

Вот что я хотел бы сделать

What I get

Вот что я ожидаю

What I expect

Вот пример , чтобы проиллюстрировать мою настоящую проблему

1 Ответ

0 голосов
/ 05 марта 2019

Вам нужен гармошка?Проверьте этот пример, https://getbootstrap.com/docs/4.0/components/collapse/#accordion-example

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...