Vuetifyでcssが効かない

Question

現在Vuetifyを使いデータテーブルを作成しているのですがCSSが効きません。
どなたか分かられる方いらっしゃいますでしょうか？
ちなみに、以下のサイトを参考にいたしました。
https://qiita.com/uucchhiiee/items/1b48ab1ba54c089fc78a

<template>
  <div>
    <h1>UserItem</h1>
    <router-link :to="{ name: 'masa' }">Top</router-link>
    <v-data-table :headers="headers" :items="items">
      <template #item.="{ item }">
        <v-btn @click="onClickShow(item)">表示</v-btn>
      </template>
    </v-data-table>
  </div>
</template>
<script>
export default {
  data: () => ({
    dialog: false,
    dialogDelete: false,
    headers: [
      { text: "テスト", value: "test_cd" },
      { text: "テスト", value: "test_nm" },
    ],
    items: [],
  }),
};
</script>

<style>
.v-data-table {
  white-space: nowrap !important;
}
</style>