Foundation 5 下拉菜单在可滚动 table 行中未对齐

Question

我想在可滚动的 table 行中添加一个下拉按钮。我能够让下拉列表在可滚动的 table 行内工作。但是，当您在 table 行 内部 滚动时，下拉菜单将错位。

这里有一些截图来详细说明。

1. 初始状态，点击Dropdown Button 1时。

2. 当您将页面滚动到 table 的 外部 时，它工作正常。

3. 当您在 table 行 内 滚动页面时，下拉菜单 错位 。

请参考jsbin中的这个例子：http://emberjs.jsbin.com/kuhavenaya/1/edit?html,css,js,output

点击Dropdown Button 1，会出现下拉菜单。

• 尝试在 table 行内部 滚动，您会看到下拉菜单将错位。
• 但是，当您在 table 的 外部 滚动时，它将 正常工作 。

非常感谢任何解决此问题的帮助和建议。非常感谢。 :)

Answer 1

上述实现的问题是下拉菜单是相对于 window 主体而不是下拉菜单容器的。

因此，解决方案是position: relative封装下拉按钮。

这是一个有效的 example，它修复了下拉菜单未对齐的问题。

谢谢~