如何使用CSS轻松地水平居中<div>？

请使用以下代码,您的div将位于中心.

.class-name {
    display:block;
    margin:0 auto;
}

你可以margin: 0 auto在你的CSS上使用而不是margin-left: auto; margin-right: auto;

九年后，我认为是时候推出新版本了。这是我的两个（现在是一个）收藏夹。

余量

设置margin到auto。你应该知道的方向顺序margin: *top* *right* *bottom* *left*;或margin: *top&bottom* *left&right*

aside{
    display: block;
    width: 50px;
    height: 100px;
    background-color: green;
    float: left;
}

article{
    height: 100px;
    margin: 0 0 0 50px; /* 50px aside width */
    background-color: grey;
}

div{
  margin: 0 auto;
  display:block;
  width: 60px;
  height: 60px;
  background-color: blue;
  color: white;
}

    
    
    
        
        
           
                
The div
        
    

margin-left: calc(50% - 'half-of-your-div-width');