Css 在Microsoft Edge中，粘性定位不会'；与dir组合时不起作用；rtl"；属性

我正在使用gatsbyJS构建一个静态站点。我想要一个有粘性的边栏<代码>位置：sticky适用于Chrome和Firefox，但在Microsoft Edge 17上没有显示侧边栏。这是因为我的html标记中有一个

dir=“rtl”

attr。我需要做什么才能使edge中的粘性元素具有

rtl

dir

我的边栏组件嵌套在布局组件中，该组件使用引导来布局页面。我知道各种可能的多边形填充，我还编写了一些js，使其在

position:fixed

中看起来不错。 但就我在其他地方看到的而言，它应该得到支持。所以我想知道我做错了什么，或者这是一个未被发现的错误

这是我的密码

sidebar.js：

const Sidebar ({ sidebarMenus }) => (
  <div id="sidebar" className="sidebar">
    <Menus menuList={sidebarMenus}/>
  </div>
)

pageLayout.js：

const PageLayout = (props) => (
  <div className="container">
    <div className="row">
      <div className="col col-12 col-md-9">
        {props.children}
      </div>
      <div className="col col-0 col-md-3">
        <Sidebar page={props.page}/>
      </div>
    </div>
  </div>
)

constpagelayout=（道具）=>(
{props.children}
)

注意：除了引导类之外，布局没有css

在edge中加载页面时，侧边栏不会出现。它在DOM中是可见的，我可以看到它在开发工具中表现为粘性，但它没有显示。它仅在我将目录更改为默认值时显示。 我们将非常感谢您对造成这种情况的原因的任何帮助

---

更新：显然这是一个已知的错误：

MS Edge中有一个错误，当html或body元素都有

dir=“rtl”

属性时，它阻止使用sticky position属性。查看位于的讨论。
如前所述，如果在主体的子元素上设置了attr，则一切正常。

dir=“rtl”

attr 因此，解决方法非常简单：只需将

dir=“rtl”

设置为任何容器div（或其他元素），该容器div将包装需要在

rtl

中的所有页面

---

我希望这对某人有所帮助。

正如我所说，dir=“rtl”在我的html标签中。如果你喜欢，我也可以粘贴。我将使用较新版本的edge进行检查。但我不理解你的例子，它们显示了位置：在我谈论sticky时已修复。我建议你使用最新版本的MS Edge进行测试。您正在使用的Edge 17是非常旧的版本。dir=“rtl”在代码中的位置。上面的代码没有这个功能。我用MS Edge 44做了一个测试，这两个示例可以很好地使用它。参考：请检查更新的示例。我建议你把你的作品作为这个问题的答案贴出来，并在有答案的时候标记出来。它可以在将来帮助其他社区成员解决类似的问题。感谢您的理解。因此在本例中，只需将

dir=“rtl”

添加到html标记中，然后在edge中运行，看看会发生什么。