title: Web page not rendering correctly in iOS browsers or desktop Safari
body: <p>I've got a simple webpage. Just a header, an unordered list, and a background image.</p>
  
  <p>The background image is blurred with CSS:</p>
  
  <pre><code>position: absolute;
  min-height:100%;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  -webkit-background-size: cover; /* Add in these */
  -moz-background-size: cover;    /* four lines to */
  -o-background-size: cover;      /* remove the white space*/
  background-size: cover;         /* around images */
  -webkit-filter: blur(5px) brightness(0.5);
  -moz-filter: blur(5px) brightness(0.5);
  -o-filter: blur(5px) brightness(0.5);
  -ms-filter: blur(5px) brightness(0.5);
  transform: scale(1.1); /* get rid of that ugly border */
  </code></pre>
  
  <p>I don't have a lot of devices to test on, but I know it looks fine in: Chrome (MacOS), Firefox (MacOS), and Chrome (Android). I borrowed a friends iPhone to look at it, and the background image does not render at all.</p>
  
  <p>In desktop Safari the image looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/MMLgQ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MMLgQ.png" alt="desktop safari"></a>
  (Text removed)</p>
  
  <p>This is what the page is supposed to look like:
  <a href="https://i.stack.imgur.com/fyj54.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fyj54.jpg" alt="This is what it is supposed to look like."></a></p>
  
  <p><a href="http://pastebin.com/ZswQgdfW" rel="nofollow noreferrer">Here's the html</a></p>