Hello to everyone who's reading this. :)
My question is: Of these two similar JSFiddles (using Vue.js (2.6.11) and Vuetify (2.4.0)), why does the v-card display properly in one of them, but not the other?
JSFiddle #1: https://jsfiddle.net/omLungap/5/
<div id="app">
<v-card>
<v-card-text>
<span v-for="i in 10" :key="i">
{{ message }}
<br>
</span>
</v-card-text>
</v-card>
</div>
Vue.use(Vuetify);
var vm = new Vue({
el: "#app",
data: {
message: "Hello, world!"
}
});
JSFiddle #2: https://jsfiddle.net/j5e0f86o/3/
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@2.4.0"></script>
<div id="app">
<v-card>
<v-card-text>
<span v-for="i in 10" :key="i">
{{ message }}
<br>
</span>
</v-card-text>
</v-card>
</div>
Vue.use(Vuetify);
var vm = new Vue({
el: "#app",
data: {
message: "Hello, world!"
}
});
Any input would be greatly appreciated!
The second fiddle does not load stylesheets. If you add
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vuetify@2.4.0/dist/vuetify.min.css"/>
they look pretty much the same (they use different Vuetify versions, so they look slightly different)