Css填充50％不会将元素放在中间

Question

我尝试将图像元素放在网格中间，但是当我将figcaption的填充设置为50％时，它不起作用。当我将其改为25％时，它将位于中心位置。为什么50％对我不起作用？

http://jsfiddle.net/GDATb/6/

Answer 1

看起来你已经搞砸了padding属性。

写填充属性的最佳方法是

padding:25% 25% 25% 25%; and this means

顶部填充为25％ 右边填充是25％ 底部衬垫是25％ 左边填充是25％

但如果您仅使用padding:50%，则意味着从所有四个边添加50％填充，这意味着覆盖所有区域。当你以25％的比例使用它时，你可以覆盖50％的区域，这就是你的代码所发生的事情。

点击here了解有关填充的更多信息。

Answer 2

首先你应该明白，填充从内到外都有效。因此，如果你有50％的衬垫，衬垫顶部占据容器的一半，衬垫底部占据底部的剩余一半。看看padding in w3c