title: Keeping responsive background images consistent across devices
body: <p>As a relative beginner, I seem to be struggling to find the right balance between creating media queries based on content rather than specific devices. </p>
  
  <p>I'm wrestling at the moment with a landing page that has a css background image covering the entire viewport. In order to ensure the image remains consistent (i.e.  no cropping) across all mobile devices, I started writing device-based media queries that each load different versions of the image. By the time I'd created them for four different iPhones (portrait and landscape) alarm bells were going off.</p>
  
  <p>Is there a better way to achieve what I'm trying to do or should I just accept that the image is going to look different from device to device?</p>
  
  <p>All help gratefully received.</p>
  
  <p>Steve</p>