有没有办法在 CSS 中添加和减去值？

Question

我有一个以负边距定位的 div，但我希望它一直延伸到其容器 div 的底部，这样我就可以使用不只是随机结束的边框。如果您查看 http://kineticaid.com/k/home.php 您就会明白什么我是说。我不能仅仅以像素为单位扩展其高度，因为容器 div 的高度会随页面动态变化。我想做的是这样的：

#rightcol {
float: right;
width: 225px;

height: 100% + 250px;

margin: -325px -25px 0 0;
}

基本上我问你是否可以在 CSS 中进行加法和减法。谢谢！

Answer 1

是的。 CSS3 具有 calc() 函数。这适用于大多数浏览器的当前版本 (http://caniuse.com/calc)。

height: calc( 100% + 250px );

演示：

HTML：

<div id="one"></div>
<div id="two"></div>

CSS：

div {
    border: 1px solid red;
    height: 100px;
}

#one {
    width: calc(50% + 20px);
}

#two {
    width: 50%;
}

输出：

Answer 2

Sass 和 less 也有你需要的类似功能，但我认为你所要求的必须用 javascript 或 jquery 来完成你的计算。

http://api.jquery.com/height/

Answer 3

这个问题的解决方案是"Faux Columns"，但是你需要稍微改变一下你的布局为了这。