Vuetify V-flex仅卡满一半

我的v-flex不尊重我的订单，只渲染了一半的元素。看到打印：

从我的角度看

这是我的脚本：

<v-card-title primary-title>
              <div>
                <p class="subheading grey--text">My title</p>
                <h3 class="headline my-4">my sub title</h3>
                <div>
                  <v-container fluid>
                    <v-card flat v-for="ticket in tickets" :key="ticket.id">
                      <v-layout row wrap :class="`pa-2 ticket ${ticket.status.id}`">
                        <v-flex xs3>
                          <div class="caption grey--text">#ID</div>
                          <div>{{ticket.id}}</div>
                        </v-flex>
                        <v-flex xs3>
                          <div class="caption grey--text">Assunto</div>
                          <div>{{ticket.subject}}</div>
                        </v-flex>
                        <v-flex xs3>
                          <div class="caption grey--text">Criado em</div>
                          <div>{{ticket.created_on}}</div>
                        </v-flex>
                        <v-flex xs3>
                          <div class="right">
                            <v-chip
                              small
                              :class="`${ticket.status.id} white--text caption my-2`"
                            >{{ticket.status.name}}</v-chip>
                          </div>
                        </v-flex>
                      </v-layout>
                    </v-card>
                  </v-container>
                </div>
              </div>
            </v-card-title>

有人有什么想法吗？

Tks。