css - Vuetify 日历高度问题

Question

我试图防止在使用 Vuetify 的工作表和日历时出现两个滚动条。

这是我的代码：

<template>
  <v-app>
    <v-main>
      <v-container fluid class="fill-height">
        <v-row justify="center" class="fill-height">
          <v-col cols="12" class="fill-height">
            <v-sheet class="fill-height">
              <v-calendar type="week" />
            </v-sheet>
          </v-col>
        </v-row>
      </v-container>
    </v-main>
  </v-app>
</template>

标签： cssvue.jsvuetify.jsheight

Answer 1

只需覆盖 Vuetify 日历组件的 CSS 即可移除多余的滚动条：

.v-calendar-daily__scroll-area {
  overflow-y: hidden !important;
}

也class="fill-height"从 中删除v-sheet，它使日历有点重叠。我不知道你为什么添加它。

在这里查看： https ://codepen.io/nmdatit/pen/OJpdwox