stackoverflow - Css3 calc()定制自适应宽度

Question

casperOne：我想用CSS设置一个50px的 p ，不能超过100%宽度，也不用JavaScript。如何实现？

Answer 1

Derek：可以实现，但不需要用IE的expression()，而是用CSS3中的Calc()即可。

p {
    width: 100%;
    width: -webkit-calc(100% - 50px);
    width: -moz-calc(100% - 50px);
    width: calc(100% - 50px);
}

Demo: http://jsfiddle.net/thirtydot/Nw3yd/66/

这样很方便，但需要注意的是目前支持CSS3的仅有3款浏览器：Firefox，Google Chrome(WebKit)和IE9

关于Calc属性详解：https://developer.mozilla.org/zh-CN/docs/CSS/calc