我的操作按钮不断更改网格对象的大小答案

【问题标题】：My action button keeps changing the size of a grid object我的操作按钮不断更改网格对象的大小
【发布时间】：2019-08-18 11:36:39
【问题描述】：

这可能是一个简单的问题，但我最近才开始使用 vuejs 和 veutify 并为我正在为学校工作的项目管理应用程序添加了一个网格系统，当我添加按钮时它会扭曲栏。我把它做成了自己的组件并尝试将它嵌套在项目栏中

我希望它看起来如何。这是在我嵌套组件https://gyazo.com/04ca8e62f32f2077d739dd9f7d6b55be

之前

现在的样子 https://gyazo.com/919725a55ccec56e133b231404c18590

我的项目条码

         <!-- Need to do container -->
       <v-container fluid grid-list-md text-xs-center>
         <v-layout column>
          <v-flex>
           <v-card dark color="blue">
             <v-card-text class="px-0">Need to Do</v-card-text>
             <v-flex>
         <!-- Nested-->   <AddTask />
           </v-flex>
          < /v-card>           
         </v-flex>
       </v-layout>
    </v-container>

我的按钮代码

        <template>
         <v-dialog max-width="800px">
           <v-btn fab small color="cyan accent-2" bottom left block 
            absolute 
          slot="activator">
         <v-icon>add</v-icon>
         </v-btn>
            <v-card>
        <v-card-title>
            <h2>Add a Task or Project</h2>
        </v-card-title>
        <v-card-text>

        </v-card-text>
    </v-card>
    </v-dialog>
     </template>

【问题讨论】：

有人知道发生了什么吗？

标签： html vue.js vuetify.js

【解决方案1】：

在<v-card-text class="px-0"> 之间移动AddTask 使用以下代码作为项目条形码：https://codepen.io/anon/pen/bZPxwW

<v-container fluid grid-list-md text-xs-center>
         <v-layout column>
          <v-flex>
           <v-card dark color="blue">
             <v-card-text class="px-0">Need to Do
 <!-- Nested-->   <AddTask />
</v-card-text>

          </v-card>           
         </v-flex>
       </v-layout>
    </v-container>

【讨论】：