Vuetify is a popular UI framework for Vue apps.

In this article, we’ll look at how to work with the Vuetify framework.

Flex align-content

We can add the align-content classes to change the alignment of flexbox content.

For example, we can write:

<template>
  <v-container>
    <v-row class="text-center">
      <v-col cols="12">
        <v-card
          class="d-flex align-content-start flex-wrap"
          color="grey lighten-2"
          flat
          tile
          min-height="200"
        >
          <v-card v-for="n in 10" :key="n" class="pa-2" outlined tile>item</v-card>
        </v-card>
      </v-col>
    </v-row>
  </v-container>
</template>
<script>
export default {
  name: "HelloWorld",
  data: () => ({}),
};
</script>

#web-development #software-development #programming #javascript #technology

Vuetify — Paddings and Margins
1.45 GEEK