Css 如何将绝对v型叠加的子v型卡设置为100%高度和宽度？

我有一个v-dialog，它有一个帮助图标，单击该图标时会在v-dialog（父v-card）框上放置一个v-overlay，以提供帮助文本。为了只在v对话框而不是整个应用程序上定位覆盖，我设置了absolute属性

<v-dialog v-model="dialog" max-width="500px">
    <v-card>
        <v-overlay absolute :value="olyHelp" opacity="1">
            <v-card @click="olyHelp=false" width="100%" height="100%">
                <p>XXXX</p>
            </v-card>
        </v-overlay>

        <v-card-title class="d-flex justify-space-between">
            <v-btn class="align-baseline" icon small @click="olyHelp=true"><v-icon small>mdi-help</v-icon></v-btn>
        </v-card-title>

        <v-card-text>
           Regular dialog stuff
        </v-card-text>
   </v-card>
</v-dialog>

XXXX

mdi帮助
常规对话内容

覆盖层内的v形卡在覆盖层内居中，宽度和高度被忽略。我试图在上面设置所有不同的css位置，但我似乎无法让它填满整个覆盖/对话框（父v卡）空间

例如：

---

我需要让v-card填充父v-card/v-overlay的全宽和全高

我遇到了同样的问题，最后通过修改css解决了它

<template>
  <v-overlay class="my-overlay">
    <v-card width="100%" height="100%">
      My content
    </v-card>
  </v-overlay>
</template>
<style scoped>
  .my-overlay >>> .v-overlay__content {
    width: 100%;
    height: 100%;
  }
</style>

我的内容
.my overlay>>>.v-overlay\u内容{
宽度：100%；
身高：100%；
}

我遇到了同样的问题，最后通过修改css解决了这个问题

<template>
  <v-overlay class="my-overlay">
    <v-card width="100%" height="100%">
      My content
    </v-card>
  </v-overlay>
</template>
<style scoped>
  .my-overlay >>> .v-overlay__content {
    width: 100%;
    height: 100%;
  }
</style>

我的内容
.my overlay>>>.v-overlay\u内容{
宽度：100%；
身高：100%；
}