vue v-html table里内容不换行 带省略号(The content in Vue v-html table does not wrap with ellipsis)

情景:  vue+element,table里使用v-html 内容是带标签<p> 可用以下方法使解决。不影响提示框:
 <el-table-column :show-overflow-tooltip="true" label="内容" align="center">
        <template slot-scope="scope">
          <div class="table-td-cell" v-html="scope.row.content" />
        </template>
      </el-table-column>


.table-td-cell{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  } 
————————
情景:  vue+element,table里使用v-html 内容是带标签<p> 可用以下方法使解决。不影响提示框:
 <el-table-column :show-overflow-tooltip="true" label="内容" align="center">
        <template slot-scope="scope">
          <div class="table-td-cell" v-html="scope.row.content" />
        </template>
      </el-table-column>


.table-td-cell{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  }