title: How to make multiple CSS background-images fluid responsive?
body: <p>I am creating a fluid responsive website that contains multiple sections that incorporate CSS background images. How would I go about making these images fluid responsive? I am aware of how to do this with a standard  tag but can't see to figure this out for CSS background images. As you can see below the  tags will each contain a background-image in my CSS.</p>
  
  <p>My Site Structure:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;title&gt;Example&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;section id="background-image-one"&gt;&lt;/section&gt;
      &lt;section id="background-image-two"&gt;&lt;/section&gt;
      &lt;section id="background-image-three"&gt;&lt;/section&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>