CSS中calc（）函数的好用例？

Question

我一直在使用calc()中的CSS功能。混合百分比和绝对值以及尺寸单位非常有用。但除了一些布局计算之外，我还没有找到很多用例。

它有一个很好的浏览器支持：http://caniuse.com/#search=calc

回到我的问题，您是否找到了这个CSS函数的任何好例子或用例？

Answer 1

如果你想让你的div在身体中心

<style>
body{
position:relative;
}
.message{
width:100px;
height:100px;
position:absolute;
left:calc(50% - 50px);
}
</style>


<div class="message">Message</div>

它的设置完全集中在所有设备中。