vuetify v-data-table ignores dense property

Question

I have a vuetify v-data-table widget that displays data. Currently the data shown uses too much space (rows have a lot of padding) so I use the dense prop. I add the property dense (like that, not dense='true') to the table opening tag but nothing happens. The display stays wide and the property is ignored.

Tried to remove all props except the items prop:

<v-data-table dense :items="results" > makes no difference. dense is ignored.

I currently have this:

`    <v-flex xs12>
      <v-data-table
        dense
        :headers="headers"
        :items="results"
        :disable-initial-sort="true"
        :pagination.sync="pagination"
        class="elevation-1 results-table"
        @update:pagination="updatePagination($event)"
      >`

Answer 1

ok, the 'elevated-1' class was overwitten causing the dense prop also to have no effect... /:

Answer 2

I had the same issue with dense property not working for v-data-table.

In my case it was the v-checkbox added to v-data-table that was causing the dense prop not to work. When using checkboxes inside v-data-table use v-simple-checkbox as explained here: https://vuetifyjs.com/en/components/data-tables/#simple-checkbox