title: PHP HTML image output
body: <p>In the <a href="http://www.php.net/manual/en/index.php" rel="noreferrer"><code>PHP manual</code></a> for <a href="http://php.net/manual/en/function.base64-encode.php" rel="noreferrer"><code>base64_encode()</code></a> I saw the following script for outputting an image.</p>
  
  <pre><code>&lt;?php
  
  $imgfile = "test.gif";
  
  $handle = fopen($filename, "r");
  
  $imgbinary = fread(fopen($imgfile, "r"), filesize($imgfile));
  
  echo '&lt;img src="data:image/gif;base64,' . base64_encode($imgbinary) . '" /&gt;';
  
  ?&gt;
  </code></pre>
  
  <p>But <em>how</em> can you output an image dynamically created with <a href="http://php.net/manual/en/book.image.php" rel="noreferrer"><code>GD</code></a>? </p>
  
  <p>I've tried this:</p>
  
  <pre><code>$im = imagecreatetruecolor(400, 400);
  
  imagefilledrectangle($im, 0, 0, 200, 200, 0xFF0000);
  imagefilledrectangle($im, 200, 0, 400, 200, 0x0000FF);
  imagefilledrectangle($im, 0, 200, 200, 400, 0xFFFF00);
  imagefilledrectangle($im, 200, 200, 400, 400, 0x00FF00);
  
  echo '&lt;img src="data:image/png;base64,'.base64_encode(imagepng($im)).'" /&gt;';
  </code></pre>
  
  <p>Why doesn't that work?</p>
  
  <p>It seems to work in <strong>IE</strong> but not <strong>Firefox</strong>.  How can I make it <strong>cross-browser?</strong></p>