How to center a DIV layer with CSS_CSS/HTML

How to center a DIV
The main style definitions are as follows:

body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }
Description:

First define TEXT-ALIGN: center in the parent element; this means that the content in the parent element is centered; for IE, this setting is enough. But it cannot be centered in mozilla. The solution is to add "MARGIN-RIGHT: auto;MARGIN-LEFT: auto;" when setting the child element definition

It should be noted that if you want to use this method to center the entire page, it is recommended not to put it in a DIV. You can split out multiple divs in sequence, as long as you define MARGIN-RIGHT in each split div. : auto;MARGIN-LEFT: auto; will do.

How to vertically center the image in a DIV
Use the background method. Example:

body{BACKGROUND: url(http://www.w3cn.org/style/001/logo_w3cn_194x79.gif) #FFF no-repeat center;}
The key is the final center, This parameter defines the position of the image. You can also write "top left" (upper left corner) or "bottom right", etc. You can also directly write the value "50 30"

The effect is as follows:

How to vertically center the text in a DIV
If it is text, you cannot use the background method. You can use the method of increasing the line spacing to achieve vertical centering. The complete code is as follows:

test content

Description:

vertical-align:middle; means vertical centering within the line. We increase the line spacing to the same height as the entire DIV line-height: 200px; and then insert the text and it will be vertically centered.