在悬停时将Div扩展为高度百分比？

Question

使用bootstrap并尝试在悬停时执行一些简单的css动画，展开元素以突出显示它。

.text-block {
  background-color: white;
  min-height: 400px;
  text-align: center;
  transition: .1s;
  margin: 1em;
}

.text-block:hover {
  margin: 0em;
  transition: .1s;
  z-index: 99;
}

这几乎看起来是正确的，因为元素似乎是因为边缘被动画化而被展开，但它向上移动页面，因此它只显示元素的3个边。

是否可以将悬停时的高度设置为非悬停高度+ 2em，以使其在CSS中的所有方向上显示增长1em？

Answer 1

将边距更改为填充。边距在元素之外添加空格。填充应该给你想要的效果：D