title: How can I automatically interpolate n intermediate values for a CSS property given an upper and lower bound?
body: <p>If I have some media queries that set a value based on the current screen width <strong>how can I automate the computation of n intermediate steps</strong>?</p>
  <p>As example: if I had a top value of 50% at 1080p and a value of 32% at 2160p I should be able to compute 4 intermediate steps:</p>
  <pre class="lang-css prettyprint-override"><code>@media(min-height: 1080px) {
    top: 50%;
  }
  @media(min-height: 1350px) {
    top: 45.5%;
  }
  @media(min-height: 1620px) {
    top: 41%;
  }
  @media(min-height: 1890px) {
    top: 36.5%;
  }
  @media(min-height: 2160px) {
    top: 32%;
  }
  </code></pre>
  <p><strong>I'm interested in any sort of possible solution: pure CSS, Sass, JS, etc.</strong></p>
  <p>(Also, could this kind of computation be possible for non linear values?)</p>