Javascript 中间弹出的固定对齐方式仅适用于移动视图

我在这个网站上有以下问题：

当用户点击进行购买时，弹出窗口如下图所示，但我希望它居中。。。在手机版上，它可以工作，所以我不确定我错过了什么。我试着检查这一页，但没有成功。任何帮助都将不胜感激

  .popUpBox {
    width: 350px;
    background: white;
    text-align: center;
    border: 1px solid gray;
    padding: 20px;
    position: fixed;
    top: 50%;
    z-index: 999999;
    line-height: 3;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}

---

一个父div

。页面容器

具有以下CSS:

转换：translate3d（0,0,0）

这完全弄乱了
位置：fixed
，弹出窗口开始随页面滚动

移除
transform:translate3d（0,0,0），弹出窗口将正常运行。
将
div.popuboxcon
移出父项div，并将其作为正文中的第一个子项

给绝对位置，它将始终在所有设备尺寸的中心


.popuboxcon{
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
z指数：10；
}

考虑使用flexbox或grid。它们是专门为解决这类问题而设计的。居中不是这里的问题。弹出窗口有一个
位置：固定的
，但仍然与页面一起滚动。@JeremyThille-看到了你的答案，同意。