title: Best way for center v-card horizontally and vertically with vuetify
body: <p>I'm currently doing the login page of my website but I can't properly center my v-card horizontally and vertically.
  The best score I have is this one:</p>
  <pre><code>&lt;template&gt;
      &lt;v-layout align-center justify-center column fill-height&gt;
          &lt;v-flex row align-center&gt;
              &lt;v-card&gt;
                  &lt;v-toolbar color=&quot;primary&quot; &gt;
                      &lt;v-toolbar-title&gt;Login&lt;/v-toolbar-title&gt;
                  &lt;/v-toolbar&gt;
                  &lt;v-text-field label=&quot;Email&quot; v-model=&quot;email&quot;/&gt;
                  &lt;v-text-field label=&quot;Password&quot; v-model=&quot;password&quot; /&gt;
                  &lt;v-footer&gt;
                      &lt;div&gt;
                          &lt;v-btn color=&quot;primary&quot; v-on:click=&quot;login()&quot;&gt;Login&lt;/v-btn&gt;
                          &lt;p&gt;I don't have account: &lt;a&gt;Register&lt;/a&gt;&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/v-footer&gt;
              &lt;/v-card&gt;
          &lt;/v-flex&gt;
      &lt;/v-layout&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      name: 'Login',
      data() {
          return {
              email: &quot;&quot;,
              password: &quot;&quot;
          }
      },
      methods: {
          login() {
              console.log('login')
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  <p>But with this, the text threads are compressed and I can't enlarge it.
  Thanks in advance for your help.</p>