title: CSS Background color is not full, it does not cover the whole page properly
body: <p>I am trying to add background color to my page, but it does not cover the whole page properly.</p>
  <p>Screenshot 1:As it can be seen here, there are white space on the background after the cards:</p>
  <p><a href="https://i.stack.imgur.com/NkpcJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NkpcJ.png" alt="enter image description here" /></a></p>
  <p>CSS CODE</p>
  <pre><code>#background  
  {   
      background-color:#9B59B6;
      margin: -19px 0 0 0; /*-19px here to remove white space on the very top of the page*/
      width: 100%;  
  }
  </code></pre>
  <p>If I add :</p>
  <pre><code>position:absolute; 
  height:100%; 
  width:100%;
  </code></pre>
  <p>It would solve the problem, However, it would cause another problem like this:</p>
  <p>Screenshot 2:Here, when I added more cards, and scroll it down, there is a white space below the background:</p>
  <p><a href="https://i.stack.imgur.com/zLpPX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zLpPX.png" alt="enter image description here" /></a></p>
  <p>CSS CODE for screenshot 2</p>
  <pre><code>#background
  { 
      position:absolute; 
      height:100%; 
      width:100%;
      background-color:#9B59B6;
      margin: -19px 0 0 0;
      width: 100%;
  }
  </code></pre>
  <p>How do I solve this? I tried using <code>position:relative</code> or <code>overflow:hidden</code>, But it does not help.</p>
  <p>I am doing this on ASP.net MVC 6, so the format is cshtml instead of html.</p>
  <p>Please help, Thank you!</p>