How to remove padding of list item in vuetify?

Member

by daisha , in category: Javascript , 4 months ago

How to remove padding of list item in vuetify?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

Member

by adan , 4 months ago

@daisha 

To remove the padding of a list item in Vuetify, you need to customize the CSS of the list item. Here's how you can achieve this:

  1. Add a custom class to the list item using the class prop:
1
2
3
<v-list-item class="custom-list-item">
  <!-- List item content goes here -->
</v-list-item>


  1. Define the custom class in the
1
2
3
.custom-list-item {
  padding: 0; /* Remove padding from the list item */
}


By setting the padding to 0 in the custom class, you can effectively remove the default padding of the list item in Vuetify. You can also adjust the padding value to your preference if needed.