title: Safari height 100% element inside a max-height element
body: <p>I'm trying to figure out why Safari won't read the max-height attribute of its parent as the height. Both Chrome and Firefox will read it correctly, but Safari seems to ignore the parent's max-height and instead grabs the page's full height. </p>
  
  <p>You can see it <a href="http://jsfiddle.net/bwheZ/">here</a></p>
  
  <p>CSS:</p>
  
  <pre><code>body, html {
      height: 100%;
      margin: 0;
  }
  div {
      height: 100%;
      max-height: 300px;
      width: 100px;
  }
  div span {
      background: #f0f;
      display: block;
      height: 100%;
  }
  </code></pre>
  
  <p>Markup:</p>
  
  <pre><code>&lt;div&gt;
      &lt;span&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm using Safari 6.0.5 on OSX 10.8.5.</p>