Html width 100% on image not spreading across the page

Question

I have a background image:

    <div style="background-image: url(images/Home/diamond.png); height: 2600px; width: 100%; border: 1px solid black;"></div>

On the page the image covers all the center and right, but not the left. When I tried width 100%, it did not spread across the page like my other div. If this helps, this div element is a child of a section element and a parent of many other multiple div elements.

Answer 1

Try this:

html { 
      background: url(images/Home/diamond.png) no-repeat center fixed; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }