中心弹出固定对齐仅适用于移动视图
当用户单击进行购买时，会出现一个弹出窗口，如下图所示，但我希望它居中......在移动版本上它可以工作，所以我不确定我错过了什么。我尝试检查该页面，但没有成功。任何帮助，将不胜感激。
.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;
}
一只斗牛犬浏览 101回答 2
2回答
-
LEATH
父 div 之一.page-container具有以下 CSS ：transform: translate3d(0, 0, 0);这完全搞乱了position:fixed，您的弹出窗口开始随页面滚动。在父级上删除transform: translate3d(0, 0, 0);，弹出窗口将正常运行。 -
幕布斯7119047
移至div.popupBoxCon父级 div 之外并将其作为主体中的第一个子级。给出绝对位置，它将始终位于所有设备尺寸的中心。.popupBoxCon{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10;}<body> <div class="popupBoxCon"></div> </body>
随时随地看视频慕课网APP
相关分类
JavaScript