How to center horizontally div inside parent div

问题:

How do I center a div horizontally inside its parent div with CSS?

  
Text
 
 

回答1:

I am assuming the parent div has no width or a wide width, and the child div has a smaller width. The following will set the margin for the top and bottom to zero, and the sides to automatically fit. This centers the div.

div#child {     margin: 0 auto; } 

回答2:

  
Text
 
 

回答3:

Text
 

回答4:

You can use the "auto" value for the left and right margins to let the browser distribute the available space equally at both sides of the inner div:

    
Text
 
 

回答5:

Just out of interest, if you want to center two or more divs (so they're side by side in the center), then here's how to do it:

     
Div 1
     
Div 2
 
    

文章来源: How to center horizontally div inside parent div