在css中，当按百分比设定的一个元素的宽度时，它确实是相对于宽度计算的，但是，对于一些竖向的距离属性呢？比如padding-top或者bottom和margin-top或者bottom等，当按百分比设定时，它们依据的是父容器的宽度，而不是高度。
下面是一个实例演示，你可以调整容器的宽度，但你会发现，黄块的padding-bottom的距离也会随之宽度而变大或变小。
以下为大家展示下
HTML：
CSS:
效果：
总结：
当移动滑动条时，我们css只修改了容器的宽度。但是，这三个属性的高度也随之变化。所以，可以看出，当按把百分比计算的是按容器的宽度，而不是高度来的。
切图 qiewtu(.com)