css - 祖父母溢出时显示日期时间选择器：隐藏

Question

让我们从一个例子开始： https ://codesandbox.io/s/ym96l09x3j

如您所见，最后一列正在渲染一个 DateTime 组件。但是，单击输入不会显示日期选择器。

那是因为.ReactTable .rt-td该类应用了“溢出：隐藏”样式。

我已经搜索了一些解决方案并找到了这个：CSS：如何在一个位置中有位置：绝对 div：相对 div 不会被溢出裁剪：隐藏在容器上

他们基本上说如果祖父母有“溢出：隐藏”，我们需要将孩子的位置设置为绝对。应该正确显示具有绝对位置的孙子（在我们的例子中为 DatePicker）。

有没有人知道如何实现这一目标？

Answer 1

尝试将此添加到您的 CSS 中：

.rdt.rdtOpen {
  position: absolute;
}

RDT 在单元格获得焦点时添加该类.rdtOpen，否则将其删除，因此应该可以解决问题。