megamenu的CSS定位和视图问题

如何解决megamenu的CSS定位和视图问题

我正在尝试在 CSS 中实现 megamenu，但我正在努力解决 megamenu 的右边缘粘在上面的下拉链接的右边缘的问题。

我想要实现的是一个全宽的 megamenu，就像它可以在 https://azelis.com

上看到的那样

在这里你可以看到我的项目和解释的问题：http://mono.calamaro.de

下面是样式化的下拉项：

  .header .header-menu .nav .nav-item .nav-dropdown {
    position: absolute;
    display: block;
    margin-top: 17px;
    left: 10%;
    z-index: -2;
    visibility: hidden;
    opacity: 0;
    background: #fff;
    width: 100vw;
    border-top: 4px solid #1E7BE2;
    padding: 15px 0;
    transition: ease-out .3s;
    pointer-events:none;
  }

第二个问题是：将鼠标指针从下拉链接移动到它的 megamenu 的速度太慢时，megamenu 消失了。你有什么提示可以解决这个问题吗？