TOC

What is this?

default setting on Vuetify cloudn’t set multiple columns on raido button and selectbox because of CSS.
I show workaround that be able to display multiple columns.

Workaround

Just set on css in style tag such as '<style lang="sass">'. I show the template, script and style at bellow.

<template>
<!-- radio button area start -->
<v-radio-group v-if="multiple" v-model="selected">
  v-radio :key="item" :label="item" :value="`${index + 1}`" v-for="(item, index) in choices">
  </v-radio>
</v-radio-group>
<!-- radio button area end -->

<!-- selectbox area start -->
<div v-if="!multiple">
  <v-checkbox
    v-model="selected"
    v-for="(item, index) in choices"
    :key="item"
    :label="item"
    :value="index">
  </v-checkbox>
</div>
<!-- selectbox area end -->
</template>

<script>
export default {
  data () {
    return {
      // If swhich radio and selectnox, change multiple to true or false.
      // When multiple is true, set selectbox else radio.
      multiple: false,
      selected: [],
      choices: [
        "choices 1", "choices2",
        "choices 3", "choices4"
    }
  }
}
</script>

<style lang="sass">
// radio
.input-group.radio
  left: 10px
  flex-wrap: nowrap
  label
    position: static
    height: auto
    width: auto
    margin-bottom: 26px
    order: 1
    text-overflow: initial
    white-space: normal
  .input-group__input
    width: auto
    flex: 0 0 30px

// selectbox
.input-group.checkbox
  left: 10px
  label
    position: static
    height: auto
    width: auto
    margin-top: -30px
    margin-left: 30px
    text-overflow: initial
    white-space: normal
  .input-group__input
    order: -1
</style>

Conclusion

When you want to change raido and selectbox style, fix css in style tag.