title: Flexible DIV keeping aspect ratio, but how to have max height?
body: <p>Using the padding trick to have an element scale in a responsive manner and maintain a set aspect ratio. But how do you set a max-height when the height is coming from padding?</p>
  
  <p>See example, I would like this to scale but once it's hits a set height then the height does not scale (but retains full width).</p>
  
  <pre><code>#container {
      background-color: #666;
      color: #ccc;
      padding-top: 23%;
      height: 0;
      overflow: hidden;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/louiswalch/9h4c8tor/" rel="nofollow">http://jsfiddle.net/louiswalch/9h4c8tor/</a></p>