title: Make background image fit to screen, override bootstrap css padding
body: <p>i wanna use a background image to fill a block of a homepage.</p>
  
  <pre><code>.testTop{
    background: url('/Images/Background/HERO Img.png') no-repeat center center fixed; 
   -webkit-background-size: cover;
   -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  }
  </code></pre>
  
  <p>so far i can with this css make a image that work good when rescale for every devices. but i can't get it to override the bootstrap css container. so i can't make it fit the whole block width. anyone know how i can override that?</p>
  
  <p>EDIT:</p>
  
  <p>So i think i need to show a sample of what I'm doing.</p>
  
  <p>Html</p>
  
  <pre><code> &lt;html&gt;
      &lt;body&gt;
        &lt;div class="contianer"&gt;
          &lt;section class="testTop"&gt;
            Fullside background image
          &lt;/section&gt;
  
          &lt;section&gt;
            normal block with text
          &lt;/section&gt;
        &lt;/div&gt;
      &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <p>So i want the section with the class "testTop" to be a fullsize background image. but i gets the bootstrap container padding. how can i remove this?</p>
  
  <p>thanks for your time.</p>