title: Change font size to fit a variable width container
body: <p>I'm trying to fluidly scale the font size to fill its variable-width container using <a href="http://jquery-textfill.github.io/" rel="nofollow">jQuery TextFill</a>. Trouble is, I think this only works with fixed-width containers. I want to use this on a site with a responsive grid.</p>
  
  <p>Here's my test, which confirms jQuery TextFill doesn't work on variable-width containers:
  <a href="http://jsfiddle.net/9uqcjdpy/1/" rel="nofollow">http://jsfiddle.net/9uqcjdpy/1/</a></p>
  
  <p>If you resize the window, you'll see the bottom div resizes, but the text doesn't scale. If you change the pixel width of the top container, you'll see the text scales, but the div can't resize responsively.</p>
  
  <p>I'm also trying to use it in a container whose height remains proportional to its width with this padding method:</p>
  
  <pre><code>width: 40%;
  padding-bottom: 23%;
  height: 0;
  </code></pre>
  
  <p>Is there any way to get this working? Doesn't need to use jQuery TextFill, but that's the closest thing I've found.</p>