title: How to put a v-card in the center of the page with Vuetify
body: <p>My goal is to have a v-card in the center of the page. I am using Vuetify. This code should work, but is doesn't:</p>
  
  <pre><code>&lt;template&gt;
    &lt;v-container fill-height&gt;
      &lt;v-row align="center" justify="center"&gt;
        &lt;v-col&gt;
          &lt;v-card flat color="grey" class="lighten-3" max-width="500px"&gt;
            &lt;v-card-title&gt;{{ title }}&lt;/v-card-title&gt;
            &lt;v-card-text&gt;
              &lt;slot name="content"&gt;&lt;/slot&gt;
            &lt;/v-card-text&gt;
            &lt;v-card-actions&gt;
              &lt;slot name="actions"&gt;&lt;/slot&gt;
            &lt;/v-card-actions&gt;
          &lt;/v-card&gt;
        &lt;/v-col&gt;
      &lt;/v-row&gt;
    &lt;/v-container&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>What am I doing wrong? Please help.</p>
  
  <p>A bit more context: I am using it as a BaseComponent in multiple places. Here is am example:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;BaseInfoMenu title="Title"&gt;
        &lt;template slot="content"&gt;
          //content
        &lt;/template&gt;
        &lt;v-btn slot="actions"&gt;...&lt;/v-btn
    &lt;/div&gt;
    //Some invisible divs 
  &lt;/template&gt;
  </code></pre>