title: Vuetify.js 2 - Data tables footer does not display properly with babel-polyfill
body: <p>I'm using Data tables in Vuetify.js 2.0.10. The footer does not display properly in IE11 as bellow.</p>
  
  <p><a href="https://i.stack.imgur.com/YFpSh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YFpSh.png" alt="enter image description here"></a></p>
  
  <p>I read this document.
  <a href="https://vuetifyjs.com/en/getting-started/quick-start#ie-11-safari-9-support" rel="nofollow noreferrer">https://vuetifyjs.com/en/getting-started/quick-start#ie-11-safari-9-support</a></p>
  
  <p>I installed babel-polyfill and @/babel/preset-env and then configured babel.config.js and vue.config.js like bellow.</p>
  
  <p>package.json</p>
  
  <pre><code>{
  "name": "table-test",
  "version": "0.1.0",
  "private": true,
  ...
  "dependencies": {
      "babel-polyfill": "^6.26.0",
      "vue": "^2.6.10",
      "vuetify": "^2.0.10",
      ...
  },
  "devDependencies": {
      "@babel/preset-env": "^7.5.5",
      ...
  }
  }
  </code></pre>
  
  <p>babel.config.js</p>
  
  <pre><code>module.exports = {
  presets: [
      '@vue/app',
      '@babel/preset-env'
  ]
  }
  </code></pre>
  
  <p>vue.config.js</p>
  
  <pre><code>module.exports = {
      transpileDependencies: ["vuetify"]
  }
  </code></pre>
  
  <p>main.js</p>
  
  <pre><code>import "babel-polyfill";  // polyfill
  import Vue from "vue";
  import App from "./App.vue";
  import router from "./router";
  import store from "./store";
  import vuetify from './plugins/vuetify';
  
  Vue.config.productionTip = false;
  
  new Vue({
  router,
  store,
  vuetify,
  render: h =&gt; h(App)
  }).$mount("#app");
  </code></pre>
  
  <p>Vue template</p>
  
  <pre><code>&lt;template&gt;
  &lt;v-data-table
          :headers="headers"
          :items="desserts"
          class="elevation-1"
  &gt;&lt;/v-data-table&gt;
  
  &lt;/template&gt;
  &lt;script&gt;
  export default {
  data: () =&gt; ({
      headers: [
          ...
      ],
      desserts: [
          ...
      ]
  }),
  };
  &lt;/script&gt;
  </code></pre>
  
  <p>My question is:
  1. Is there any way to resolve this problem?
  2. When I open this Vuetify document page in IE11
  <a href="https://vuetifyjs.com/en/components/data-tables" rel="nofollow noreferrer">https://vuetifyjs.com/en/components/data-tables</a>
  the footer displays properly, Why?
  <a href="https://i.stack.imgur.com/TNvVU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TNvVU.png" alt="enter image description here"></a></p>