填充/边距百分比-可能的CSS错误？

所以我正忙着制作一个水平滚动的网站。集装箱部门有一类区域。它的宽度是可变的，就像传统场地上的平均div高度是可变的一样

我的站点是垂直响应的，所以我使用了很多百分比值，包括高度，就像在普通站点上使用百分比宽度一样

问题是，当我在div.area上使用百分比padding/margin时，它会根据div的宽度而不是高度来计算百分比，即使例如设置padding top时也是如此

这类似于尝试设置正常站点主体上剩余的填充百分比，并根据站点的高度计算填充。这简直是疯了，完全不直观

---

这是一个已知的问题吗？还是故意的？还有，是否存在任何仅限于CSS的解决方案。我不想使用JS或其他东西来解决类似的问题，我宁愿在ems中设置填充。W3C标准规定，任何和的百分比都是元素宽度的百分比，而不是高度的百分比：

该百分比是根据管道的宽度计算的 生成的框的包含块。请注意，这是真实的 “保证金上限”和“保证金下限”也是如此。如果包含块 宽度取决于此元素，则结果布局未定义 在css2.1中

但是，顶部和底部位置由容器高度决定；没有唯一的CSS方法可以做到这一点，但如果您愿意加入一些JS，这是完全可能的

我能想到的一些非详尽列表的解决方案：

从顶部的位移仅为CSS的50%，然后通过负顶部边距进行偏移，该边距是基于JS计算的元素自身高度的一半

确定容器高度后，通过JS计算顶部和底部衬垫/边距

---

W3C标准规定，和的任何百分比都是元素宽度的百分比，而不是高度的百分比：

该百分比是根据管道的宽度计算的 生成的框的包含块。请注意，这是真实的 “保证金上限”和“保证金下限”也是如此。如果包含块 宽度取决于此元素，则结果布局未定义 在css2.1中

但是，顶部和底部位置由容器高度决定；没有唯一的CSS方法可以做到这一点，但如果您愿意加入一些JS，这是完全可能的

我能想到的一些非详尽列表的解决方案：

从顶部的位移仅为CSS的50%，然后通过负顶部边距进行偏移，该边距是基于JS计算的元素自身高度的一半

确定容器高度后，通过JS计算顶部和底部衬垫/边距

---

只是偶然发现了同样的问题。适合我的解决方案：

不要设置宽度/高度并使用

.percent10 {
  top: 10%;
  left: 10%;
  bottom: 10%;
  right: 10%;
}

---

只是偶然发现了同样的问题。适合我的解决方案：

不要设置宽度/高度并使用

.percent10 {
  top: 10%;
  left: 10%;
  bottom: 10%;
  right: 10%;
}