title: Linked images inside SVG
body: <p>Imagine the following SVG:</p>
  
  <pre><code>&lt;svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
      &lt;image xlink:href="foo.png" x="0" y="0" width="100" height="100"/&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>The image, foo.png, resides in the same directory. If we open this SVG in the browser, it will display foo.png correctly. But if we try to use this SVG in <code>&lt;img src="..."&gt;</code>, or in <code>&lt;image xlink:href="..."/&gt;</code> inside another SVG, there will be no foo.png displayed. Tested with latest Firefox and Chrome, both with file:// and http://. There is nothing in the console of either browser, and network monitor shows no attempts to load a bitmap.</p>
  
  <p>Am I missing something? I know everything will be OK if I embed foo.png as "data:image/svg+xml;base64,...", but I really want to avoid that. Bitmaps I'm trying to include can be rather huge, so I would better prefer linking instead of embedding.</p>