I have a vuetify data table, I've set width for every column and I want to fixed column's width of my table but it has grown up because of their content and it doesn't matter what is the width of them. how can fixed column's width?

  <template>
    <v-data-table
        v-if="physicianAccountsLocalData"
        :headers="headers"
        :items="physicianAccountsLocalData"
        hide-default-footer
        class="data-table"
        :items-per-page="-1"
      >
        <template #[`item.isActive`]="props">
          <BaseSwitch
            v-model="props.item.isActive"
            class="switch-siam-table"
            @change="changeModel($event, props)"
          />
        </template>
        <template #[`item.location`]="props">
          <span
            class="location"
            :class="{'text-disable-state': !props.item.isActive}"
          >
            {{ props.item.location }}
          </span>
        </template>
        <template #[`item.name`]="props">
          <span
            class="name"
            :class="{'text-disable-state': !props.item.isActive}"
          >
            {{ props.item.name }}
          </span>
        </template>
      </v-data-table>
  </template>

  <script>
     data() {
    return {
         headers: [
          { text: 'فعال', value: 'isActive', sortable: false, width: '110px', align: 'right' },
          { text: 'نوع', value: 'location', sortable: false, width: '13%', align: 'start' },
          { text: 'نام', value: 'name', sortable: false, width: '200px' }
          ],
         }
      }
  </script>