<html>
  <body style="background-color: black">
    <canvas id="canvas" width="800" height="600" style="display: block; margin: auto; border: 1px solid grey; position: relative; top: 50%; transform: translateY(-50%);"></canvas>
    <script src="mandel.demo.js"></script>
    <script>
      var canvas = document.getElementById('canvas');
      var ctx = canvas.getContext('2d');
      function paint() {

        for (x = 0; x < 800; x++) {
          for (y = 0; y < 600; y++) {
            var x0 = mandel.demo.scale(x, 800, -2.5, 1.5);
            var y0 = mandel.demo.scale(y, 600, -1.5, 1.5);
            iteration = mandel.demo.iterations(x0, y0);
            hexVal = ((iteration < 10)? "0":"") + iteration.toString(16);
            ctx.fillStyle = '#' + hexVal + hexVal + '00';
            ctx.fillRect(x, y, 1, 1);
          }
        }
      }

      paint();
    </script>
  </body>
</html>

<html>
  <body style="background-color: black">
    <canvas id="canvas" width="800" height="600" style="display: block; margin: auto; border: 1px solid grey;"></canvas>
    <script src="mandel.demo.js"></script>
    <script>
      var canvas = document.getElementById('canvas');
      var ctx = canvas.getContext('2d');
      function paint() {

        for (x = 0; x < 800; x++) {
          for (y = 0; y < 600; y++) {
            var x0 = mandel.demo.scale(x, 800, -2.5, 1.5);
            var y0 = mandel.demo.scale(y, 600, -1.5, 1.5);
            iteration = mandel.demo.iterations(x0, y0);
            hexVal = ((iteration < 10)? "0":"") + iteration.toString(16);
            ctx.fillStyle = '#' + hexVal + hexVal + '00';
            ctx.fillRect(x, y, 1, 1);
          }
        }
      }

      paint();
    </script>
  </body>
</html>

Revert "Vertically centered image", broken on Firefox
Revert "Vertically centered image", broken on Firefox

This reverts commit 44743df0c2e20da47cf66156193630ace55f19c9.
