Table: fix show tooltip, fixed #714 (#717)

examples/docs/zh-cn/table.md

@@ -675,6 +675,7 @@
 <template>
   <el-table
     :data="tableData3"
+    border
     style="width: 100%"
     @selection-change="handleSelectionChange">
     <el-table-column

examples/docs/zh-cn/tooltip.md

@@ -7,7 +7,8 @@
     }
   };
 </script>
-## Tooltips 文字提示
+
+## Tooltip 文字提示
 
 常用于展示鼠标 hover 时的提示信息。
 
@@ -118,7 +119,7 @@ Tooltip 组件提供了两个不同的主题：`dark`和`light`。
 ```
 :::
 
-### 更多Content
+### 更多 Content
 
 展示多行文本或者是设置文本内容的格式
 

packages/table/src/table-body.js

@@ -36,7 +36,6 @@ export default {
                 {
                   this._l(this.columns, (column, cellIndex) =>
                     <td
-                      style={ this.getColumnWhiteSpaceStyle(column) }
                       class={ [column.id, column.align, this.isCellHidden(cellIndex) ? 'hidden' : '' ] }
                       on-mouseenter={ ($event) => this.handleCellMouseEnter($event, row) }
                       on-mouseleave={ this.handleCellMouseLeave }>
@@ -118,10 +117,6 @@ export default {
       return classes.join(' ');
     },
 
-    getColumnWhiteSpaceStyle(column) {
-      return column.showTooltipWhenOverflow ? { 'white-space': 'nowrap' } : {};
-    },
-
     handleCellMouseEnter(event, row) {
       const table = this.$parent;
       const cell = getCell(event);

packages/theme-default/src/table.css

@@ -39,8 +39,16 @@
       z-index: 1;
     }
 
+    .el-tooltip {
+      display: block;
+    }
+
     .el-tooltip__rel {
       display: block;
+
+      .cell > * {
+         white-space: nowrap;
+      }
     }
 
     @e empty-block {