How to use CSS to center the DIV display

Today to bring you the code is a lot of friends need to use, CSS to achieve DIV center, the need for friends can collect this article, the need to use CSS to achieve the center of the div when you can easily use, with CSS to achieve the center of the div a lot of ways, This is a relatively simple and compatible piece of code, so come in and check it out.

The main CSS code needed is two, one is text-align:center (content Center), the other is margin:0 auto, and its two styles need to be used in order to achieve the center display layout of Div box.

First we set the body Text-align:center, and then the need to center the Div box set CSS style margin:0 auto, so that the corresponding Div horizontal center.

The example explains the DIV Center code application, in order to observe the DIV center effect, we set a div to the div named ". Div" in the HTML div tag using class= "DIV", set its width to 400px, height is 100px, the border is red. So that we can observe the effect.

1. Complete HTML+CSS Code

<! DOCTYPE html> 
Div Center Code application features

This centering method is to make the DIV center effect perfectly compatible with the major platforms, compatible with the major browsers, regardless of the high version ie or high version of IE are compatible.

The above is how to use CSS to center the div display method, you learned it?