title: How to keep an image size intrinsic, before it is loaded, so layout is stable?
body: <p>I had always thought you could specify an <code>&lt;img/&gt;</code>'s <code>width</code> and <code>height</code> attributes so the browser knows its physical dimensions without having to download (at least the header) first. But apparently the attributes are treated as CSS properties - and are thus overridden when you try to do something like <code>width: 50%; height: auto</code>. Then, <strong>until the image is downloaded, the computed height remains 0</strong>.<br>
  Is there a way to explicitly set the image's physical dimensions (effectively its aspect ratio) via HTML/CSS?</p>
  
  <p>(...and avoid "flashes of unknown aspect ratio" / lots of nervous re-layouting when using Masonry - which you could perhaps work around, but I'm more interested in the basic problem. Even if i'm struggling with asking succinctly about it :)</p>