Home >Web Front-end >HTML Tutorial >position:fixed in css to achieve div centering_html/css_WEB-ITnose
Centered up, down, left and right
Copy the code as follows
div{
position:fixed;
margin:auto;
left:0;
right:0;
top:0;
bottom:0;
width:200px;
height:150px;
}
If you only need left and right Center, then delete bottom:0; or top:0;
If you only need to center top and bottom, then delete left:0; or right:0;
Attach a DIV element below Center the browser window
In fact, it is not complicated to achieve this effect. It can be easily accomplished by using position positioning in CSS. Let’s take a look at the code:
Copy the code as follows
All the setting techniques are here:
The code is as follows Copy the code
.dialog{
position: fixed;
_position:absolute ; /* hack for IE6 */
z-index:1;
top: 50%;
left: 50%;
margin: -141px 0 0 -201px;
width: 400px;
height:280px;
border:1px solid #CCC;
line-height: 280px;
text-align:center;
font-size: 14px;
background -color:#F4F4F4;
overflow:hidden;
}
Set position: fixed; _position:absolute;
Set left:50% and top:50%;
Set margin: -(DIV's offsetWidth/2) 0 0 -(DIV's offsetHeight/2)
from:http://www.111cn.net/cssdiv/css/62281.htm