title: Making a body background image with fixed positioning
body: <p>I use this to set the size and it works well for abstract images that can handle some x-y distortion.</p>
  
  <pre><code>body{
    background:  url('foo/images/flowers.jpg');
    background-size:  100%;
  }
  </code></pre>
  
  <p>However as content expands downward this does not work as the image begins to repeat.</p>
  
  <p>I noticed that twitter has one image that does not change no matter how far you scroll down.</p>
  
  <p>It behaves like</p>
  
  <pre><code>position: fixed
  </code></pre>
  
  <p>I could use a div with a background image and position fixed but then I would loose the automatic scaling provided by the <code>body</code> tag combined with <code>background-size: 100%</code></p>