如何在不向内部容器提供固定高度的情况下显示滚动条，而外部容器的位置固定

Question

我想在不为内部容器提供固定高度的情况下显示滚动条，而外部容器的位置固定。 我面临一个问题，如果我向 innerContainer 提供固定高度。当我检查响应性并更改窗口的高度时，位置固定的外容器隐藏了内容器的内容。

// OUTER CONTAINER
<div style={ { width: "250px", zIndex: 5, position: "fixed", right: "2rem" } }>
    <div style={ { width:"100%, height: "100px" } }>
        // having some other content
    </div>
    // INNER CONTAINER
    <div style={ { width: "100%", height: "400px", overflowY: "auto" } }>
       // overflowing content inside the container
    </div>
</div>

有什么解决办法请帮帮我。我会非常感谢时间和帮助。

Answer 1

添加到外部容器：

display: "flex", flexDirection: "column"

然后你可以移除内部容器的高度。