padding-top: 50%是相对什么的50% ?
企业：腾讯
当时我看到这个题目我就懵了，这么简单？？？ 现实告诉我，我是菜鸡，我是菜鸡。又菜又没有自知之明🤦♂️
去w3school查到是这样的.传送门
padding-top 属性设置元素的上内边距（空间）。
说明
该属性设置元素上内边距的宽度。行内非替换元素上设置的上内边距不会影响行高计算，因此，如果一个元素既有内边距又有背景，从视觉上看可能延伸到其他行，有可能还会与其他内容重叠。不允许指定负内边距值。
注释：不允许使用负值。
| 默认值： | 0 |
|---|---|
| 继承性： | no |
| 版本： | CSS1 |
| JavaScript 语法： | object.style.paddingTop="10px" |
可能的值
| 值 | 描述 |
|---|---|
| length | 规定以具体单位计的固定的上内边距值，比如像素、厘米等。默认值是 0px。 |
| % | 定义基于父元素宽度的百分比上内边距。此值不会如预期的那样工作于所有的浏览器中。 |
| inherit | 规定应该从父元素继承上内边距。 |
注意padding-top 百分比定义基于父元素宽度的百分比上内边距！！是基于宽度
思考 ：既然padding如此，那margin呢？
于是我就找到这样一道题
问题：当margin-top、padding-top的值是百分比时，分别是如何计算的？
A 相对父级元素的height，相对自身的height
B 相对最近父级块级元素的height，相对自身的height
C 相对父级元素的width，相对自身的width
D 相对最近父级块级元素的width，相对最近父级块级元素的width
答案：D
解析：可以对元素的margin设置百分数，百分数是相对于父元素的width计算，不管是margin-top/margin-bottom还是margin-left/margin-right。（padding同理）
如果没有为元素声明width，在这种情况下，元素框的总宽度包括外边距取决于父元素的width，这样可能得到“流式”页面，即元素的外边距会扩大或缩小以适应父元素的实际大小。如果对这个文档设置样式，使其元素使用百分数外边距，当用户修改浏览窗口的宽度时，外边距会随之扩大或缩小。
为什么margin-top/margin-bottom的百分数也是相对于width而不是height呢？
CSS权威指南中的解释：
我们认为，正常流中的大多数元素都会足够高以包含其后代元素（包括外边距），如果一个元素的上下外边距时父元素的height的百分数，就可能导致一个无限循环，父元素的height会增加，以适应后代元素上下外边距的增加，而相应的，上下外边距因为父元素height的增加也会增加，如果循环。就死循环了
我是菜鸡🤦♂️，我投降。
