如何防止我的 div 与扩展面板一起移动答案

【问题标题】：How to prevent my div from moving with expansion panel如何防止我的 div 与扩展面板一起移动
【发布时间】：2019-01-31 23:55:05
【问题描述】：

我正在尝试制作这样的可视化：

我使用了内置的 card 和 card-columns 的引导程序。但是当我展开一个面板时，我所有的<div>s 都在随机移动：

我希望其他扩展面板在我打开一个扩展面板时不要移动。这是一个示例：StackBlitz。

【问题讨论】：

请出示您的代码。
闪电战中的 Angular 和 JS 代码与您当前的问题无关。请提供 static minimal reproducible example 作为 SO sn-p，以便我们自己测试您的代码
角码与我的问题有何关系？

【解决方案1】：

我一直在测试您的 stackblitz 代码，“问题”在第 8 行：

<div class="card-columns">

在类名中，“card-columns”是一个预定义类，可能在 BootStrap 预定义类中。

我的建议是删除此类并使用另一种替代方法，例如 flex-layout。或者使用 html 列。

我已经分叉了您的 stackblitz 代码并使用 html 列解决了问题： https://stackblitz.com/edit/angular-material-bootstrap-css-qmrzcm

下一步是在每列之间添加自定义填充。

【讨论】：