title: How to make content touch the edge of a viewport in Bootstrap
body: <p>I am having trouble making content touch the edge of the browser with Twitter Bootstrap. </p>
  
  <p>I am developing a website that is full-width and where there are images that touch the edges of viewports. I have used <code>.container-fluid</code> div to my <code>.row</code> and <code>col-</code> divs. </p>
  
  <p>What I have tried so far:</p>
  
  <ol>
  <li>I tried removing padding from <code>.container-fluid</code>, but unfortunately this makes a horizontal scrollbar to appear in the browser;</li>
  <li>I attached a custom class that removed padding from individual <code>col-'s</code>, but this does not seem right to play with the core Bootstrap grid system to achieve such a simple effect. What is more, the purpose is not to remove all gutters, but in a first and last <code>col-</code> in a <code>row</code> (left and right gutter, respectively)</li>
  <li>I introduced negative margins to different elements on my site so that they eat up the padding on both sides of the browser that I want to get rid off - this, however, makes a horizontal scrollbar appear, too.</li>
  </ol>
  
  <p>I have serched the web to find a solution to this problem but, unfortunately, there wasn't a clear answer offered.</p>
  
  <p>To put it concisely:</p>
  
  <p>What do you do to make content touch the edges of a viewport when developing with Bootstrap?</p>