通过为容器设置 `max-height` 和 `overflow-y: scroll`，配合 `scrollintoview({ block: “end” })`，可在动态内容展开时自然“向上推挤”上方元素视觉效果，并精准滚动至目标区域底部，避免影响下方元素布局。
在构建可折叠（collapsible）UI组件时，一个常见但易被误解的需求是：“当点击中间某一项展开时，希望它向上生长，推动上方元素上移，而下方元素保持不动”。初看像是 CSS 布局方向的反转问题（如试图用 flex-direction: column-reverse 或 transform: scaleY(-1)），但实际这是典型的 XY 问题——真正目标并非“反向伸展”，而是 提供符合用户预期的空间反馈与焦点引导。
直接操控高度方向（如 top 偏移、position: absolute）会脱离文档流，无法推动相邻元素；而单纯切换 display: none/unset 则默认从上往下撑开，影响后续兄弟节点。更健壮、语义清晰且兼容动态内容的解法是：将整个列表包裹在固定高度的可滚动容器中，并利用原生滚动定位能力实现视觉上的“向上展开感”。
✅ 推荐方案：滚动容器 + 智能定位
核心思路：
