水平布局
元素的水平布局有几个属性共同决定
margin-left border-left padding-left width padding-right boder-right......
一个元素在其父元素中,水平方向的等式
margin-left + border-left+ padding-left width .........
=父元素宽度
0 +0 +0 +100 +0 +0 +0 =400
以上等式满足,如果不满足,则浏览器会自动调整,这个叫过度约束
.inner{
width: 100px;
height: 100px;
background-color: red;
margin-right:auto;
/*margin-left:auto;*/
/* boder:10px black auto */
}
-浏览器调整
1:如果七个值没有auto,那么浏览器会自动调整margin-right使我们等式满足
2:这七个值 width margin-left 可以设置 auto
如果有设置auto,浏览器会自动调整auto值
如果设置margin-left为auto
例子:30