日期选择器部分被溢出-y滚动隐藏

Posted 2023-05-07

【中文标题】日期选择器部分被溢出-y滚动隐藏

【英文标题】：Datepicker partially hidden by overflow-y scroll

【发布时间】：2014-11-04 13:07:18

【问题描述】：

我正在构建一个引导网格列，其中有一个面板。

在这个面板中，我有一个日期选择器，并且必须有很多其他控件，所以我需要能够在面板内向下滚动（仅 y 轴）。

不幸的是，日期选择器弹出窗口被部分隐藏了，因为溢出-z 和溢出-x 样式启用了滚动：

<div style="height: 480px;overflow-y: scroll;overflow-x:hidden;">
...
</div>

是否有可能通过一些 CSS 技巧来克服这个问题？

当弹出的元素可以放在 div 之外时，我已经找到了一个答案，但在我的情况下，我使用的是 Angular-strap 库中的指令，所以我需要将它放在里面。

我已经设置了一个 plunker 来说明这个问题（你需要全视图才能看到它）：plunker

【问题讨论】：

弹出窗口看起来不错

@JordanD 你打开全屏视图了吗？

是的，没有溢出

@JordanD Weird.. 我在 Mac、PC、Chrome、Firefox 上尝试过，弹出窗口部分隐藏。当输入比弹出窗口窄时，它会出现在右侧。我会尝试上传屏幕截图。

【参考方案1】：

好吧，既然没人回答，我今天才找到答案，其实很简单。

我只需要在属性中添加这个：

data-container="body"

Plunker here

【讨论】：

太棒了，实际上我在找什么:)

感谢您的回答。这适用于引导日期时间选择器吗？因为我不能在那里应用这种方法。

对不起，我不能告诉你。我现在正在使用自定义日期选择器。