CODEWITHSUNDEEP
vue.jsvuetify.js
spinnning
spinnning

Reputation: 35

Float Vuetify Checkboxes if needed

Question: How do you float v-checkboxes if there is not enough space. At the moment I have these checkboxes in a single row

Checkboxes

but if the space is not enough the last checkbox doesn´t want to float.

enter image description here

I have already applied d-flex as a class and also tried float-left.

This is the code for the checkboxes:

<v-row>
    <v-col cols="12" class="d-flex justify-center">
        <v-checkbox v-for="item in checkboxitems" :key="item.id"
            v-model="item.value"
            color="primary"
            :label="item.text"
            disabled
            class="pl-2 pr-2 float-md-left"
        >
        </v-checkbox>
        
    </v-col>

</v-row>

Upvotes: 0

Views: 77

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

Try to use the flex-wrap utility class :

 <v-col cols="12" class="d-flex justify-center flex-wrap">

Upvotes: 2

Related Questions