How to center div with css

Method: 1. Use the "position:absolute" and "transform:translate(-50%,-50%)" styles in the div to center it. 2. Use the "position:absolute" and "margin:auto" styles in the div to center it.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

Method 1:

Use absolute positioning of the div: absolute, and set the left and top values ​​to 50%. Use the CSS3 transform attribute. transform: translate(-50%,-50%).

Rendering:

##Method 2:

Pair div Use absolute layout position:absolute; and set the values ​​of top, left, right, and bottom to be equal, but not necessarily equal to 0; and set margin:auto.

Rendering:

(Learning video sharing:

css video tutorial)

The above is the detailed content of How to center div with css. For more information, please follow other related articles on the PHP Chinese website!