title: Vuetify Data Table: Ellipsis overflow for specific columns
body: <p>I have a basic data-table like this:</p>
  
  <pre><code>&lt;v-data-table
    :headers="headers"
    :items="documents"
    :items-per-page="10"
    :loading="loading"
    :search="search"
    :footer-props="footer_props"
    :single-select="true"
    v-model="selected"
    item-key="artifactID"
    class="elevation-1"
    style="width: 100%; align-content: center;"
    height="45vh"
    fixed-header
    show-select
  &gt;
    &lt;v-progress-linear 
      slot="progress" 
      color="blue" 
      indeterminate
    /&gt;
    &lt;v-alert 
      slot="no-results" 
      :value="true" 
      color="error" 
      icon="warning"
    &gt;
      Your search for "{{ search }}" found no results.
    &lt;/v-alert&gt;
  &lt;/v-data-table&gt;
  </code></pre>
  
  <p>It has 4 columns, and one more column generated automatically to the left for single-select. I managed to define the width of each column by defining the width of the headers.</p>
  
  <p>I want to make the contents of the cells of specific columns to truncate with ellipsis when the length of the text exceeds the width specified for the header.</p>
  
  <p>It tried to use the item.name slot and a div with defined CSS style, something like this:</p>
  
  <pre><code>&lt;template v-slot:item.rawDataFile.fileName="{ item }"&gt;
    &lt;div 
      v-on="on"
      style="white-space: nowrap; width:100%;"
    &gt;
      &lt;span style="display: inline-block; overflow: hidden; text-overflow: ellipsis; width:100%;"&gt;
        {{ item.rawDataFile.fileName }}
      &lt;/span&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>But it didn't work. Instead of truncating, when the text is really long, it instead increases the width of the column, which is exactly the opposite of what I want. And if I specify something like 50%, the width of the column will still be expanded as if the text was not truncated but the text itself will be truncated at 50%, making it look really weird.</p>
  
  <p>Is there a way for me to keep the column width fixed to the width specified for the headers and have the text truncate when exceeding this width instead of going to the next line like how the data table seems to behave by default and if possible, do this only to specific columns?</p>