DIV使用position:fixed时让其居中显示
今天在做一个弹出层,用于注册登录,使用DIV标签,ID设为sign。
其属性如下:
#sign {
position: fixed;
z-index: 9999;
top: 20px;
left: 50%;
width: 400px;
height:300px;
margin-left: -200px;
background:#333;
}
position: fixed;
z-index: 9999;
top: 20px;
left: 50%;
width: 400px;
height:300px;
margin-left: -200px;
background:#333;
}
在电脑端正常居中显示,但是如果在移动端就占了全屏。
于是我将width改为95%,但是却偏左显示了,并没有居中。
因为其中使用了position:fixed
,所以还需要改一下。
@media handheld, only screen and (max-width:768px) {
#sign{
width:95%;
left: 0px;
right: 0px;
margin:auto;
}
}
#sign{
width:95%;
left: 0px;
right: 0px;
margin:auto;
}
}