html - 以桌面为中心但不以移动设备为中心的弹出表单

Question

我有一个页面，当你点击一个链接但你没有登录时，会弹出一个表单来登录。它在桌面上运行完美，始终位于页面中心，但在移动设备上它位于顶部，因此如果我单击页面底部的链接，我必须一直向上滚动才能看到它。我的表单 CSS 是:

div.wpcf7 {
position: absolute;
margin: 0 auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 490px;
height: 440px; 
z-index: 1042;
background: #f9f9f9;
}

Answer 1

绝对是相对于页面的。固定是相对于窗口(视口(viewport))。

 position: fixed;