html - CSS 帮助。打开扩展 div 而不将内容向下推

Question

根据图像，图 1 为关闭状态。一旦用户在第二个面板中展开绿色 div，下面的内容（蓝色）也会被下推。有没有办法只使用CSS 我可以打开绿色 div 而不会向下推蓝色内容？

我正在使用第三方组件，所以我无法更改 HTML，所以我只能使用 CSS。

目前这 3 个 div 被包裹在另一个 div 中display: flex; flex-wrap: wrap。任何建议将不胜感激

标签： htmlcssweb

Answer 1

您应该研究 CSS 网格，它是迄今为止初学者学习使用列和行来调整 div 大小的最佳方式。您必须设置任何 div 的宽度和高度以使其不调整大小，否则内容将仅根据其中的内容移动，这是一个不同的问题。