title: css inherit from calc property seems to repeat calculation instead of inheriting the computed value
body: <p>I'm having to classes that go like that </p>
  
  <pre><code>.c1{height:calc(100%-50px;}
  .c2{height:inherit;}
  </code></pre>
  
  <p>then a bit of DOM that uses them:</p>
  
  <pre><code>&lt;div class="c1"&gt;
    &lt;div class="c2"&gt;
      foo
    &lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>so the problem is that if the div.c1 ends up with a heigth of let's said 400, I wished that the div.c2 would have the same height.</p>
  
  <p>Turns out that div.c2 has height 350px. (using google chrome Version 64.0.3282.140 (Official Build) (64-bit) )</p>
  
  <p>It quite looks like the calc was applied again.</p>
  
  <p>I couldn't find any pointer on that.</p>
  
  <p>Any idea ? is it the expected behavior ? or is it a glitch ?</p>