Dialog % height of the screen

Viewed 9903

I'd like to make the dialog(https://vuetifyjs.com/en/components/dialogs/) fill x% width and x% height of the screen. setting the width=80% does work as expected, the height does nothing though. any idea how to do this?

1 Answers

You need to set the height for the component inside the dialog. For eg, if you are using v-card, inside v-dialog then set the height of v-card. v-dialog will then scale accordingly.

<v-dialog
  v-model="dialog"
  width="50%"
  >
 <v-card height="50vh">
   //Card contents 
 </v-card>
</v-dialog>
Related