为什么边缘铬上的滚动边距顶部行为不同？

如何解决为什么边缘铬上的滚动边距顶部行为不同？

目前我不得不在我的 WP 网站上修复不同浏览器上的滚动行为.. 现在适用于 FF、Safari 和 Chrome。

现在的情况是，我无法专门针对新的边缘浏览器（铬）。

这里是带有锚点的菜单：

<li class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-1400"><a href="https://ferevuti.myhostpoint.ch/schneideroptik/brillen/#korrekturfassungen" aria-current="page" class="elementor-sub-item elementor-item-anchor elementor-item-active">Korrekturbrillen</a></li>

这里是锚点指向的部分：

<section class="elementor-section elementor-top-section elementor-element elementor-element-589117b elementor-reverse-mobile elementor-section-Boxed elementor-section-height-default elementor-section-height-default" data-id="589117b" data-element_type="section" id="korrekturfassungen">

部分css简单：

.elementor-187 .elementor-element.elementor-element-589117b {
padding: 50px 0 0;

}

以及我在页面上使用的 CSS 来修复除边缘 Canavary 之外的所有浏览器上的锚点滚动

/* Anweisung für Fü FireFox  */
@-moz-document url-prefix() {
  section
  {
      scroll-margin-top: 12rem !important ;
          padding-top: 50px !important;
}
    
}

/* Anweisung für Chrome  */
  section
 {
      scroll-margin-top: 4rem;
     
    }

  
/* Anweisung für Safari  */

@supports (background: -webkit-canvas(squares)) {
  section {
  margin-top: -6em !imporatnt;
  padding-top: 4em !important;
  }
}

如果它对这里有帮助https://ferevuti.myhostpoint.ch/schneideroptik/brillen/

不幸的是，如果我点击锚链接，然后在 chrome 中点击，Edge 上的 scroll-margin-top 行为/位置会有所不同。

我尝试使用

@supports (-ms-ime-align:auto) {
  section
 {
     scroll-margin-top: 10rem;
     
}
  
}

但这适用于较旧的浏览器。

是否有直接将 scroll-margin-top 用于边缘或目标边缘铬的解决方法？