Position:fixed in CSS to implement DIV center

Center up or down

The code is as follows	Copy Code
div{ position:fixed; Margin:auto; left:0; right:0; top:0; bottom:0; width:200px; height:150px; }

If only need to center, then put bottom:0; or top:0; You can delete it.
If you only need to center up and down, then put the left:0; or right:0; Can

The following is a DIV element centered in the browser window

In fact, the implementation of this effect is not complicated, using CSS position positioning can be easily done. Let's take a look at the code:

The code is as follows	Copy Code
<style type= "Text/css" > . dialog{ position:fixed; _position:absolute; 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; } </style> <div class= "Dialog" > I was in the middle of the window, hehe! </div>

The tips for setting are all here:

The code is as follows	Copy 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;
Setting up left:50% and top:50%;
Set margin:-(div offsetwidth/2) 0 0-(Div's OFFSETHEIGHT/2)

Effect chart