How can I insert row/column (with v-for) in Card?

Question

I'm trying to build a simple page with Vuetify and Vue.

On this page, I will have a few cards too. So I need this card's width and height fixed.

I need these items inside of the v-card, also scrollable. How can I do that?

     <v-container>
    <v-col cols="12" sm="16" md="8" lg="4">
      <v-card height="720px">
        <v-card-title class="unselectable" primary-title>
          Card Title
        </v-card-title>

        <v-spacer></v-spacer>

        <v-card-text>
          <v-container>
          <v-row class="pa-2">
            <v-col
              v-for="(item, i) in items"
              :key="i"
              class="d-flex child-flex"
              cols="6"
            >
              <v-card>
                <v-img
                  :src="getImage(item)"
                  height="130px"
                  class="grey lighten-2"
                >
                  <template v-slot:placeholder>
                    <v-row
                      class="fill-height ma-0"
                      align="center"
                      justify="center"
                    >
                      <v-progress-circular
                        indeterminate
                        color="grey lighten-5"
                      />
                    </v-row>
                  </template>
                </v-img>

                <v-card-text class="unselectable text-center font-weight-bold">
                  {{ item.title }}
                </v-card-text>
              </v-card>
            </v-col>
          </v-row>
        </v-card-text>
      </v-card>
    </v-col>
  </v-container>

Answer 1

Try out to add the property overflow-y:auto to the card style like :

 <v-card height="720px" style="overflow-y:auto">