javascript - Foundation 5 下拉菜单在可滚动表格行中未对齐

Question

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

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

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

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

3. 当您在表格行内部滚动页面时，下拉菜单未对齐。

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

点击下拉按钮 1，将显示下拉菜单。

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

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

Answer 1

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

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

这是一个有效的 example修复了下拉菜单错位问题。

谢谢~