实现table表格100%填充

表格中有一列是结果列，需要根据测试结果显示不同的背景色，背景色要求100%填充整个格子
在这里插入一个template

<el-table-column label="Result">
          <template slot-scope="scope">
            <div
              class="result"
              :class="
                scope.row.result === ''
                  ? ''
                  : scope.row.isQualified
                  ? 'qualified'
                  : 'unqualified'
              "
            >
              {{ scope.row.result }}
            </div>
          </template>
        </el-table-column>

• 将放置结果的div设为长宽100%，但是光设置100%还不行，因为100%是相对父元素而言的，我们并没有设置父元素的宽高
• 为div设置弹性盒模型，这样它就能填充整个父元素
• 再使内容居中即可

.test-con .result {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.qualified {
  background: #85ce61;
}
.unqualified {
  background: #f78989;
}