用百分数设置margin和paddding的时候，其top right bottom left的值是参照父元素盒子的宽度进行计算,如

 .demo1{ width:980px;height:500px;  }
 .demo1 div{margin:10% 5%; } // 相当于margin:98 49;

1、高度持续增加

第一种说法是，padding-top如果以容器高度为参照，那么子元素应用padding值将会继续加高容器的高度，容器高度的变化又会反过来继续影响子元素的padding-top，陷入一个无限循环。

对于不定高的容器来说情况确实如此，但对定高容器则并不成立，这点和height类似，这也是为什么height的容器也必须确定好高度。也就是说，如果padding-top要参照容器高度，就必须和height一样做两种处理。

2、保持padding(margin)四个值统一

第二种说法则更为可靠，为了保持padding(margin)四个值的统一。

padding(margin)的值无论引用何种计量，四个值都一直保持统一，难道单独给百分比开特例？结合第一条的多情况处理，如果标准定义padding-top参照容器高度的话，恐怕要列出至少4条以上的例外说明——而这对无论谁，都没有好处。

事实上，垂直padding参照体是宽度这点也非常有用。虽然早期固化像素的设计中百分比值几乎不应用在padding或者margin上，但随着移动自适应的布局的需要，百分比也逐渐稀疏平常。

比如配合background-sizing保持背景的比例，配合media query调整对应的间距，不一而足。这些应用都基于一个事实：无论垂直还是水平，百分比值始终参考宽度。

(1)css设置绝对定位后 top,bottom,设置百分比定位是按父元素的高度来计算的，同样left,right,设置百分比定位是按父元素的宽度来计算的

(2)如果父元素设置有padding值则子元素定位 top的’百分比’值是其父元素的height加上padding-top和padding-bottom

(3)设置了定位position: absolute的盒子，将top设为0%，盒子顶部将会紧挨着父元素（已定位）的顶部，若设为100%，则盒子顶部将会紧挨着父元素底部。

计算公式为：top_percent = 子盒子顶部距父盒子顶部的距离 / 父盒子高度

(1)line-height: line-height 属性可取值有 normal | number| length | % | inherit，行高就是两行文本的基线（字母x的下边缘）之间的距离

height一般用固定值

什么时候用margin什么时候用padding

(1)边界(margin)：元素周围生成额外的空白区。“空白区”通常是指其他元素不能出现且父元素背景可见的区域。——CSS权威指南

(2)padding称呼为内边距，其判断的依据即边框离内容正文的距离，而我喜欢CSS权威指南解释的“补白”（或者叫“留白”），因为他很形象。补白(padding)：补白位于元素框的边界与内容区之间。很自然，用于影响这个区域的属性是padding。——CSS权威指南

(1)何时应当使用margin：

(2)何时应当时用padding：

个人认为：margin是用来隔开元素与元素的间距；padding是用来隔开元素与内容的间隔。margin用于布局分开元素使元素与元素互不相干；padding用于元素与内容之间的间隔，让内容（文字）与（包裹）元素之间有一段“呼吸距离”。

-百分比设置margin和padding,line-height,height