为什么不能以负值计算得出顶级工作？

Question

申请

top : - 32px;

有效，但以下内容无效：

top : calc(8px - 50%);

我希望该属性是动态的，因为目标是在具有可变高度的父div中垂直对齐div。任何想法将不胜感激！

Answer 1

工作正常。

＆＃13;

＆＃13;

div#outer {
  position: relative;
  width: 200px;
  height: 100px;
  margin: 100px;
  background-color: green;
  overflow: visible;
}

div#inner {
  width: 20px;
  height: 20px;
  position: absolute;
  top: calc(8px - 50%);
  background-color: red;
}

＆＃13;

<div id="outer">
  <div id="inner">
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;