The fixed position attribute in CSS implements div centering_javascript skills

The position attribute specifies the positioning type of the element. This attribute defines the positioning mechanism used to establish the layout of the element. Any element can be positioned, but absolute or fixed elements generate a block-level box, regardless of the type of the element itself. A relatively positioned element is offset from its default position in normal flow.

Up, down, left, right, center

div{
  position:fixed;
  margin:auto;
  left:0;
  right:0;
  top:0;
  bottom:0;
  width:200px;
  height:150px;
}

If you only need left and right centering, then delete bottom:0; or top:0;

If you only need to center the top and bottom, then use left:0; or right:0;

Attached below is a DIV element centered in the browser window

Actually, 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:

<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">我是在窗口正中央的，呵呵！</div>

All the setup tips are here:

.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)

Rendering

The above content is the entire description of the fixed position attribute in CSS to achieve div centering shared by the editor. I hope you like it.