####margin与可视尺寸 可改变可视尺寸，适用于没有设定width/height的普通的block水平元素，只适用于水平方向尺寸。可实现一侧定宽的自适应布局； ####CSS margin于百分比单位 margin的百分比值都是相对于宽度计算的 ####绝对定位的margin百分比值 margin的百分比相对于第一个定位祖先元素（absolute/relative/fixed）的宽度计算。 ####margin重叠 发生在block水平元素（不包括浮动或定位元素），只发生在垂直方向。 ####margin-top重叠 1.父元素非块状格式化上下文元素。方法：父元素设置overflow:hidden;

2.父元素没有border-top。方法：borer-top:;

3.父元素没有padding-top。方法：padding-top:;

4.父元素和第一个元素没有inline元素分隔。方法：加入一个内联元素，如一个  ####margin-bottom重叠 1.父元素非块状格式化上下文元素。方法：父元素设置overflow:hidden;

2.父元素没有border-bottom。方法：borer-bottom:;

3.父元素没有padding-bottom。方法：padding-bottom:;

4.父元素和最后一个元素没有inline元素分隔。方法：加入一个内联元素，如一个 

5.父元素没有height/min-height/max-height的高度限制。方法：这只高度。 ####空block元素的margin重叠 解决方法参照margin-top ####使用列表等垂直布局 建议margin-top,margin-bottom都使用，因为当最后一个元素移除时，不会改变原来的布局。 ####margin的auto属性 margin:auto;只会水平居中，不会垂直居中是因为垂直方向不会自动填充。 ####writing-mode与垂直居中 writing-mode:vertical-lr;更改流的方向为垂直方向。设置margin:auto;课垂直居中，但是改变了流的方向，水平方向不再居中。 ####绝对定位元素的水平锤子居中 父元素设置position:relative;，子元素设置position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;IE8浏览器及以上支持 ####margin负值下的两端对齐 多列布局下，为父元素设置margin负值，可以使最后一列或者第一列的margin得到处理，实现两端对齐 ##margin负值下的等高布局 html:<div id="box"><div class="box1"><div class="box1"></div></div></div>

css:.box{overflow:hidden;resize:vertical;} .box1{float:left;margin-bottom:-1000px;padding-bottom:1000px;} ####margin无效情形解析 1.内联水平元素(非替换元素，如)垂直margin无效

2.dispaly:table-cell;/display:table-row;等声明的元素margin无效。

3.绝对定位的元素在非定位方向margin"无效",因为绝对定位元素脱离文档流，所以在非定位方向设置margin不会造成影响。

4.图片浮动，相邻元素设置margin以图片浮动方向为准，margin值需加上图片大小。

5.内联特性导致margin无效， ####控制margin重叠 margin-collapse:collapse(默认重叠)/discard（取消）/separate(分隔)；