-webkit-line-clamp和text-align: justify共用
发布于 6 年前 作者 weimo 2647 次浏览 来自 问答
  • 当前 Bug 的表现（可附上截图）

可以看到第一个"…"和文字重叠了，两个样式是一样的，只是内容不一样，也就是某些文字的尺寸组合会导致这样

  • 预期表现

都像第二个的表现（在chrome中测试，不管内容如何表现都是正常的）

  • 复现路径

wxml:

<view class="intro">当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现当前 Bug 的表现</view>

css:

.intro {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  word-break: break-all;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-align: justify;
  margin-bottom: 2em;
}
  • 提供一个最简复现 Demo
2 回复

你好，问题已复现，我们会尽快修复！请先避免两个一起使用

去掉text-align: justify显示正常，两者一起用有问题

回到顶部