title: How to remove container margin in vuetify?
body: <p>I want to remove margin left and right from <code>v-container</code> so I add <code>pa-0</code> class.</p>
  
  <p>Also I need to have a space between each element so I using <code>grid-list-sm</code>.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="app"&gt;
    &lt;v-app id="inspire"&gt;
      &lt;v-container fluid grid-list-sm class="pa-0"&gt;
        &lt;v-layout row wrap&gt;
          &lt;v-flex v-for="i in 6" :key="i" xs4&gt;
            &lt;img :src="`https://randomuser.me/api/portraits/men/${i + 20}.jpg`" class="image" alt="lorem" width="100%" height="100%"&gt;
          &lt;/v-flex&gt;
        &lt;/v-layout&gt;
      &lt;/v-container&gt;
    &lt;/v-app&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The problem is <code>grid-list-sm</code> is reducing size to <code>4px</code> in <code>&lt;v-layout row wrap&gt;</code> because margin <code>-2px</code>. and makes the v-layout to be widther than his parent.</p>
  
  <p><strong>I do not want to use <code>overflow-x:hidden</code>. I just want the elements to align correctly.</strong></p>
  
  <p>So, how I can solve this problem? (without workaround)</p>
  
  <p><a href="https://i.stack.imgur.com/Nj7fv.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Nj7fv.jpg" alt="enter image description here"></a></p>