Как задать отступ в v-layout

Как в v-layout (vietify) задать вертикальный отступ между строками?

    <v-layout
        row
        style="margin-top: 1%; margin-left: 4%; display: flex; justify-content: start"
        v-show="!loading"
    >
        <div
            class="custom-app-containers display-1"
            style="padding-left: 7px"
        >
            <b>{{ title }}</b>
        </div>
        <div
            v-for="course in courses"
            :key="course.id"
        >
            <Card
                style="margin: 0; padding: 0"
                :course="course"
            />
        </div>
    </v-layout>

ue


Ответы (1 шт):

Автор решения: hedgehogues

Решается очень просто. Избавляемся от <v-layout> и задаём flex-wrap: wrap

<div
    style="margin-top: 1%; margin-left: 4%; display: flex; justify-content: start; flex-wrap: wrap; "
    v-show="!loading"
>
    <div
        class="custom-app-containers display-1"
        style="padding-left: 7px"
    >
        <b>{{ title }}</b>
    </div>
    <div
        v-for="course in courses"
        :key="course.id"
    >
        <Card
            style="margin: 0; padding: 0"
            :course="course"
        />
    </div>
</div>

введите сюда описание изображения

→ Ссылка