CSS3中width的calc()用法

之前遇到好多时候不知道父级容器的宽度，大多数都是借助js或jquery获取父级HTML标签的宽度，然后再减去之间的间隔距离来确定容器内图片或子级容器的宽度，现在CSS3的calc很好的解决了这个问题，不要烦了。。。

CSS代码

    .demo{        background: #666;        display: flex;        -webkit-justify-content: space-between;        -moz-justify-content: space-between;        justify-content: space-between;      }    .box{        width: 33.333333333333336%;        width: calc((100% - 15px*2) / 3);        background: #f00;        height:90px;    }

HTML代码

   <div class="demo">       <div class="box"></div>       <div class="box"></div>       <div class="box"></div>    </div>

效果图