JSFiddle - React, Tailwind, and code Playground

by glittle

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui/lib/index.js"></script>
<div id="app">
  <div class="smsListing">
      <el-table stripe
                size="mini"
                max-height="200"
                :data="data">
        <el-table-column type="selection" reserve-selection></el-table-column>
        <el-table-column label="Sample" prop="text"></el-table-column>
      </el-table>
    </div>
</div>

CSS

@import url("//unpkg.com/element-ui/lib/theme-chalk/index.css");

JavaScript

var Main = {
  data() {
    return {
      input: '',
      data: [{
        text: 'Selection box in top is not aligned.'
      }, {
        text: 'It should be centered in the column.'
      }]
    }
  }
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')