How can I use v-for loop to iterate through columns with Vue.js How can I use v-for loop to iterate through columns with Vue.js vue.js vue.js

How can I use v-for loop to iterate through columns with Vue.js


Looks like you're using Bulma CSS.

Problem:

Bulma columns dont wrap to a new row by default.

Solution:

Add the class is-multiline to your columns container and it should wrap your columns automagically.

Bulma Reference

    <div class="columns is-multiline">        <div v-for="s in specials" class="column is-one-third">            <div class="card">                <div class="card-content">                    {{s.specialDetail}}                </div>            </div>        </div>    </div>