Estoy tratando de construir un marcador y ahora tengo dos tarjetas para cada equipo. En cada una de esas tarjetas habrá dos filas: una para el logotipo de los equipos y otra para el marcador actual. Mi problema en este momento es que la alineación del logotipo y la partitura no funcionan. Ambos todavía están a la izquierda. A través de prueba y error, obtuve esto ahora, pero estoy atascado. ¿Alguien puede detectar mi error?

¡Cualquier ayuda es apreciada!

Modelo:

 <template> <v-container fluid> <v-row class="ma-5" dense align="center" justify="center"> <v-col cols="5"> <v-card elevation="10" outlined> <v-container> <v-row align="center" justify="center" no-gutters> <v-col> <v-img src="@/assets/home.png" width="65%" /> </v-col> </v-row> <v-row justify="center" align="center" no-gutters> <v-col> <span style="font-size: 16rem"> {{ this.homeScore }} </span> </v-col> </v-row> </v-container> </v-card> </v-col> <v-col cols="2"> <v-img src="@/assets/vs.png" /> </v-col> <v-col cols="5"> <v-card elevation="10" outlined class=""> <v-container> <v-row align="center" justify="center" no-gutters> <v-col> <v-img src="@/assets/away.png" width="65%" /> </v-col> </v-row> <v-row justify="center" align="center" no-gutters> <v-col> <span style="font-size: 16rem"> {{ this.awayScore }} </span> </v-col> </v-row> </v-container> </v-card> </v-col> </v-row> </v-container> </template>