title: Vuetify v-carousel arrows overlapping problem
body: <p><br>
  I met a problem with Vuetify v-carousel. Where the left and right arrows are overlapping on the left side. <br>
  <strong>Image</strong>
  <a href="https://i.stack.imgur.com/jUHW6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jUHW6.png" alt="enter image description here"></a></p>
  
  <p><strong>Vue file</strong></p>
  
  <pre><code>&lt;template&gt;
    &lt;v-card v-if="propertyThis"&gt;
      &lt;v-carousel
        cycle
        hide-delimiters
      &gt;
        &lt;v-carousel-item
          v-for="(item,i) in propertyThis.pictures"
          :key="i"
          :src="item"
        /&gt;
      &lt;/v-carousel&gt;
  </code></pre>
  
  <p><strong>package.json file</strong></p>
  
  <pre><code>  "dependencies": {
      "vue": "^2.6.10",
      "vue-class-component": "^7.0.2",
      "vue-property-decorator": "^8.3.0",
      "vue-router": "^3.1.3",
      "vuetify": "^2.1.0",
      "vuex": "^3.0.1",
      "vuex-class": "^0.3.2"
    },
  </code></pre>
  
  <p>I didn't see an obvious difference to the codes on <a href="https://vuetifyjs.com/en/components/carousels#hide-delimiters" rel="nofollow noreferrer">this page</a>. 
  How to fix it?<br></p>
  
  <p>Any help will be appreciated.</p>
  
  <p>Update:<br></p>
  
  <p>I commented out all lines in the .css files and in between the 'style' tag in the .vue files. But the problem is still there.<br>
  Here is the html parts from the page:</p>
  
  <pre><code>&lt;div class="v-window__prev"&gt;
      &lt;button type="button" class="v-btn v-btn--flat v-btn--icon v-btn--round theme--dark v-size--default" aria-label="Previous visual"&gt;
          &lt;span class="v-btn__content"&gt;
              &lt;i aria-hidden="true" class="v-icon notranslate mdi mdi-chevron-left theme--dark" style="font-size: 36px;"/&gt;
          &lt;/span&gt;
      &lt;/button&gt;
  &lt;/div&gt;
  &lt;div class="v-window__next"&gt;
      &lt;button type="button" class="v-btn v-btn--flat v-btn--icon v-btn--round theme--dark v-size--default" aria-label="Next visual"&gt;
          &lt;span class="v-btn__content"&gt;
              &lt;i aria-hidden="true" class="v-icon notranslate mdi mdi-chevron-right theme--dark" style="font-size: 36px;"/&gt;
          &lt;/span&gt;
      &lt;/button&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>I cannot find anything obviously wrong. </p>