Actualmente tengo un problema con vue-agile. Como de costumbre, he importado el componente. Ahora aquí está la plantilla con su padre. Solo para hacerle saber, estoy usando vuetify para mi interfaz y su padre actual está en pantalla flexible.

 <v-row class="d-flex"> <v-col> Some codes here... </v-col> <v-col> <template> <agile> <div class="slide"> <h3>slide 1</h3> </div> ... <div class="slide"> <h3>slide n</h3> </div> </agile> </template> </v-col> </v-row>

El problema es que Vue Agile expande el ancho del div principal y le agrega un desplazamiento horizontal. Intenté hacer vue ágil y sus etiquetas correspondientes en bloque y lo forcé con bloque de estilo usando !important en css pero aún extiende el ancho y aunque encontré preguntas similares en otras plataformas, el problema tampoco está resuelto por su parte. Estoy pidiendo ayuda si hay alguien que haya encontrado esto y hay una solución para encajar vue-agile en un flexbox sin extender su ancho. Vue-agile ni siquiera sigue cuadrículas. Intenté agregar columnas pero aún no obtuve el resultado que deseaba.

Aquí está la imagen inicial sin el vue-agile

Aquí está el que tiene vue ágil. Usé texto para la muestra pero todavía funciona de manera similar