我可以用 SASS \ Compass 计算和使用元素高度吗

我在 RoR 项目中使用 sass 和 compass。我需要分配给top元素的 CSS 属性值，即元素高度除以 -2。我可以用 SASS \ Compass 来做吗？

你似乎已经得到了XY问题 https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem。您有一项任务需要解决，但您没有向我们询问该任务，而是询问您尝试过但已发现不合适的解决方案。

你为什么要申请top属性等于元素高度的一半并取反？因为你想要将绝对定位的元素向上移动一半高度。这是原来的任务。

有一个简单的解决方案可以实现这一点，甚至不需要 SASS！ （实际上，只要你不知道元素的高度，SASS就无法提供比CSS更多的帮助。）

我们需要一个额外的包装器：

<div class=container>
  <div class=elements-wrapper>
    <div class=element>
    </div>
  </div>
</div>

要将元素向上推至其高度的 50%，请执行两个简单的步骤：

1) 将其包装纸完全从容器中推出：

.elements-wrapper {
  position: absolute;
  bottom: 100%; }

2) 现在将元素向下拉至其高度的 50%：

.element {
  margin-bottom: -50%; }

就是这样！

当你这样做时margin-bottom: -50%，您实际上将该元素拉低了 50%包装纸的高度。但包装器的高度等于元素的高度！

别忘了申请position: relative到容器，否则position: absolute将相对于窗口，而不是容器。

这是一个demo带有注释良好的代码：http://jsbin.com/uwunal/4/edit http://jsbin.com/uwunal/4/edit

更新2013-04-16

我刚刚才意识到这是一个骗局。

在 CSS 中，上边距和下边距的百分比是指width容器的。所以上面的例子仅仅因为容器是正方形而有效。