margin:0 auto设置水平居中的问题

margin:0 auto

用于设定该元素在父元素水平方向上处于居中的位置，必须注意该元素要设置width，否则该样式不会起作用。

测试代码为：

.f{  width: 500px;  height: 500px;  background-color: #1abc9c;  margin: 0 auto;  }
 .s{  width: 300px;  height: 300px;  background-color: orangered;  }
 .cs{  width: 80px;  height: 80px;  background-color: pink;  margin: 0 auto;  }
<div class="f">
 <div class="s">
     <div class="cs"></div>
 </div>

测试结果为：f元素位于body元素水平居中位置，cs元素位于s元素水平居中的位置。