我正在尝试使用vuetify v-flex制作卡片列表,这是代码
<div id="app">
<v-app>
<v-content>
<v-container fill-height fluid>
<v-layout>
<v-flex xs12>
<v-card dark color="grey">
<v-card-title>
<div>
<h2>Top Questions</h2>
</div>
</v-card-title>
</v-card>
</v-flex>
<v-flex xs12>
<v-card v-for="item in items" :key="item._id">
<v-card-title>
<h3>{{ item.title }}</h3>
<p>{{ item.content }}</p>
</v-card-title>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-content>
</v-app>
</div>
Run Code Online (Sandbox Code Playgroud)
我希望每个都v-flex
将填满该行的100%。但是他们只填满了一半。
https://codepen.io/anon/pen/mKBMEW
但是,我可以d-inline-block
在v-layout上添加prop 。我只是想知道之前我的第一个代码会发生什么。