react + antd 样式问题排除

antd table td内容超长突破width限制

效果如下:

原始配置:

解决方案实践:

方案1:ellipsis + Tooltip 超宽隐藏并覆层预览

方案2:原生html(搞笑的一个方案)

方案3:-webkit + line-clamp + word-break

问题:限制3行,但是实际是四行然后再第三行省略。并且展示有错位。line-clamp在chrome不支持。-webkit的兼容性也不是很好。

方案4:只保留方案3的 word-break

你可能感兴趣的:(react + antd 样式问题排除)