[Bug] fix(VDataTable): fix header column widths not being respected

[nekosaur]

Description

setting both width and min-width as styles on header row was the only
way I could get a consistent result

Motivation and Context

closes #5072, #7623

How Has This Been Tested?

Markup:

<template>
  <v-container>
    <v-data-table
      :headers="headers"
      :items="items"
      :items-per-page="5"
      class="elevation-1"
      show-select
    ></v-data-table>
  </v-container>
</template>

<script>
export default {
  data: () => ({
     headers: [
      { text: 'Firstname', value: 'firstname', width: '300px' },
      { text: 'Lastname', value: 'lastname' },
      { text: 'Starship Name', value: 'starship', width:'400px' },
      { text: 'Nationality', value: 'nationality' },
      { text: 'Hobbies', value: 'hobbies' },
       { text: 'Likes', value: 'likes' },
       { text: 'Dislikes', value: 'dislikes' },
    ],
    items: [
      { firstname: 'Jean-Luc', lastname: 'Picard', rank: 'Captain', starship: 'Enterprise NCC1701D', nationality: 'French', hobbies: 'Archaeology', likes:'Wine', dislikes:'Borg' }
    ]
  })
}
</script>

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Improvement/refactoring (non-breaking change that doesn't add any features but makes things better)

Checklist:

• The PR title is no longer than 64 characters.
• The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and breaking changes).
• My code follows the code style of this project.
• I've added relevant changes to the documentation (applies to new features and breaking changes in core library)
• I've added new examples to the kitchen (applies to new features and breaking changes in core library)