Vuetify Two Images in Carousel-Item - vue.js

Question

All I want is to have a carousel-item that contains two images. At the very least I want two carousels side by side. Any ideas since wrapping the carousels in row-cols or simply trying a sheet containning two images in each carousel item does not work.
EDIT : Notice how the component surpasses the right edge of the app drawer (should not happen and also on transition the background of the carousel flashes black. Ideally I get a carousel that is responsive with the two images inside transitionning without flashing black.
<template>
<v-container>
<v-row>
<v-col cols="1">
<v-btn icon large #click="toggle">
<v-icon>{{ playIcon }}</v-icon>
</v-btn>
</v-col>
<v-col>
<v-slider
color="light-green"
thumb-color="light-green accent-4"
thumb-size="30"
track-color="light-green accent-4"
v-model="run"
max="19"
:tick-labels="ticksLabels"
tick-size="6"
ticks/>
</v-col>
</v-row>
<v-carousel
:cycle="playPause"
hide-delimiters
interval=3000
v-model="run"
height="700px"
hide-delimiter-background
show-arrows-on-hover
>
<v-carousel-item
transition="fade-transition"
reverse-transition="fade-transition"
v-for="(item,i) in items"
:key="i"
>
<v-row>
<v-card width="49%">
<v-img contain :src="item.avg"/>
</v-card>
<v-spacer></v-spacer>
<v-card width="49%">
<v-img contain :src="item.std"/>
</v-card>
</v-row>
</v-carousel-item>
</v-carousel>
</v-container>
</template>

Answer 1

You can fix the black flashing by adding these two props to the v-carousel
:dark="$vuetify.theme.dark"
:light="!$vuetify.theme.dark"
And to fix the scope of the component you can add this style.
<style scoped>
.v-carousel .v-window-item {
position: absolute;
top: 0;
width: 100%;
}
.v-carousel-item {
height: auto;
}
</style>