当用户单击进行购买时,会出现一个弹出窗口,如下图所示,但我希望它居中......在移动版本上它可以工作,所以我不确定我错过了什么。我尝试检查该页面,但没有成功。任何帮助,将不胜感激。 .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;}
2 回答
LEATH
TA贡献1936条经验 获得超6个赞
父 div 之一.page-container
具有以下 CSS :transform: translate3d(0, 0, 0);
这完全搞乱了position:fixed
,您的弹出窗口开始随页面滚动。
在父级上删除transform: translate3d(0, 0, 0);
,弹出窗口将正常运行。
幕布斯7119047
TA贡献1794条经验 获得超8个赞
移至div.popupBoxCon父级 div 之外并将其作为主体中的第一个子级。
给出绝对位置,它将始终位于所有设备尺寸的中心。
.popupBoxCon{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 10;
}
<body>
<div class="popupBoxCon"></div>
</body>
添加回答
举报
0/150
提交
取消