位置：在 Microsoft Edge 中滚动期间粘滞闪烁，但在其他浏览器中没有

Question

我有一个导航栏，它可以跨越我的页面并在使用滚动时跟随视口position:sticky 唯一的类（我相信）这确实值得发布，.secondary-heading但我不想排除其他 scss 影响我的问题的可能性。

.secondary-heading {
  // This is the class in question....
  position: sticky;
  z-index: 1000;
  top: 0;
  width: 100%;
  // The remainder might not be necessary... 
  .tab-bar {
    height: 70px;
    background-color: $white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px;
    &:not(.with-title) {
      box-shadow: 0px 5px 5px -5px $medium-gray;
    }
    img {
      margin-right: 20px;
    }
    >div {
      a {
        @include font-size(20);
        padding: 0 15px;
        color: $dark-gray;
        position: relative;
        top: -4px;
        padding-bottom: 19px;
        padding-top: 25px;
        &:hover {
          color: $sea-blue;
          cursor: pointer;
        }
        &.active {
          background-color: $standard-gray;              
          color: white;
          &:hover {
            color: white;
            cursor: initial;
          }
        }
      }
    }
  }
  .title-bar {
    height: 70px;
    background-color: $standard-gray;        
    color: white;
    @include font-size(30);
    box-shadow: 0px 5px 5px -5px $medium-gray;
    display: flex;
    align-items: center;
    span {
      margin-left: 240px;
    }
  }
}

在 Chrome 和 Firefox 上，这种样式完美地工作并按预期滚动页面，但在 Edge 中，滚动条会闪烁。有没有办法设置它的样式，这样条形就不会闪烁？

这是我的 NavBar 的 HTML：

<div class="secondary-heading">
  <div class="tab-bar" [class.with-title]="showTitleBar">
    <div>
      <a routerLink="#" i18n>Home</a>
      <a routerLink="#" i18n>Link</a>
      <a routerLink="#" i18n>Link</a>
    </div>        
  </div>
  <div class="title-bar">
    <span>{{ headerTitle }}</span>
  </div>
</div>    

我正在使用版本控制：

Microsoft Edge 42.17134.1.0 Microsoft EdgeHTML 17.17134