title: Center v-switch inside a v-flex
body: <p>I would like to center the <code>v-switch</code> element inside a <code>v-flex</code> horizontally and I already tried this here: <a href="https://stackoverflow.com/questions/46404884/vuetify-center-items-into-v-flex">vuetify center items into v-flex</a>, but it seems not to work for the <code>v-switch</code> element.</p>
  
  <p>Whether I wrap it inside a div class like this:</p>
  
  <pre><code>&lt;v-flex xs12 md2 &gt;
      &lt;div class="text-xs-center"&gt;
          &lt;v-switch
              @click="someFunction()"
              label="Some Label Name"
              color="black"
              value="secondary"
              hide-details
          &gt;&lt;/v-switch&gt;
      &lt;/div&gt;
  &lt;/v-flex&gt;
  </code></pre>
  
  <p>Or I use the class directly inside the <code>v-flex</code>:</p>
  
  <p><code>&lt;v-flex xs12 md2 text-xs-center&gt;</code></p>
  
  <p>It doesn't work. Also using other classes like <code>class="justify-center"</code> doesn't work. </p>
  
  <p>Here is a <a href="https://codepen.io/saitam1/pen/aMeNzb" rel="nofollow noreferrer">codepen</a>, so you can see the problem</p>
  
  <p>What is the right way to do it?</p>