title: stack vuetify elements in one page
body: <p>Using vuetify, how can I make two UI components show up on one singular page?  I have tried combining elements within one   bracket and got error messages.  When stacking components in separate   only thee bottom template appears in the front end.  Is there a way two stack UI components using vue-router?  </p>
  
  <p>edit:  my goal is to place two ui components such as photo grid and carousel  from vuetify on top each other to create a print out similar to this screenshot  <a href="https://i.stack.imgur.com/m0VRI.jpg" rel="nofollow noreferrer">mash-up</a>.</p>
  
  <p>This is the code that produces my current localhost printout <a href="https://i.stack.imgur.com/YxqlT.jpg" rel="nofollow noreferrer">code sample of stacking templates</a> and the <a href="https://i.stack.imgur.com/X6qeo.jpg" rel="nofollow noreferrer">localhost printout</a>.  </p>
  
  <pre><code> &lt;template&gt;
   &lt;v-layout&gt;
  &lt;v-flex xs12 sm6 offset-sm3&gt;
    &lt;v-card&gt;
      &lt;v-container grid-list-sm fluid&gt;
        &lt;v-layout row wrap&gt;
          &lt;v-flex
            v-for="n in 9"
            :key="n"
            xs4
            d-flex
          &gt;
            &lt;v-card flat tile class="d-flex"&gt;
              &lt;v-img
                :src="`https://picsum.photos/500/300?image=${n * 5 + 10}`"
                :lazy-src="`https://picsum.photos/10/6?image=${n * 5 + 10}`"
                aspect-ratio="1"
                class="grey lighten-2"
              &gt;
                &lt;v-layout
                  slot="placeholder"
                  fill-height
                  align-center
                  justify-center
                  ma-0
                &gt;
                  &lt;v-progress-circular indeterminate color="grey lighten-5"&gt;&lt;/v-progress-circular&gt;
                &lt;/v-layout&gt;
              &lt;/v-img&gt;
            &lt;/v-card&gt;
          &lt;/v-flex&gt;
        &lt;/v-layout&gt;
      &lt;/v-container&gt;
    &lt;/v-card&gt;
    &lt;/v-flex&gt;
  &lt;/v-layout&gt;
  
  &lt;v-carousel&gt;
    &lt;v-carousel-item
      v-for="(item,i) in items"
      :key="i"
      :src="item.src"
    &gt;&lt;/v-carousel-item&gt;
  &lt;/v-carousel&gt;
  &lt;/template&gt;
  </code></pre>