Question

我们的一位质量保证人员在字段集中发现了一个错误，其中长字会突破该元素。我用一个简单的自动换行修复了这个问题：break-word。但后来又找到了另一个。而另一个。而另一个。

我可以与他进行长时间的争论，我说这是一个愚蠢的错误，因为没有用户会输入一个60个字母的单词，但它可能更容易修复它。你对做什么有什么看法

<fieldset>
  <p>Here_is_a_really_long_string</p>
</fieldset>

我不知道这会导致任何问题。

编辑：在几个不同的环境中出现了几个地方。

在某些地方看起来像这样：

<table>
..
<td>Here_is_a_really_long_string</td>

我们发现了另一个地方：

Angel angel1( "Angel of Death" , locationB );
std::cout << angel1.name << " is in " << *angel1.location << std::endl;

我认为我们看到的最重要的地方是长网址字符串以及我们从中导入RSS源的地方包含here_is_a_string等数据。

我会与质量保证/项目经理谈谈，但我不知道客户对省略号的看法。

Answer 1

您可以限制区域的宽度，并在末尾添加一些“...”。试试这个

.truncate {
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

Answer 2

你最好的选择是使用溢出：隐藏在需要的地方。您不希望覆盖默认元素自动换行。

Answer 3

在英语中，60个字母的单词并不常见，但在其他语言中可能并非如此。因此，它取决于您的软件将如何使用以及谁负责该内容。

如果你修复它，我至少会使用一个更具体的选择器，只将包装应用于页面的特定表格或其他相关部分而不是所有元素。

另外，我会和Q＆amp; A家伙谈谈。也许他们同意这毕竟不是一个真正的问题，尽管如果你想让他们站在你这边，我会更加小心，而不是把它称为“愚蠢的错误”。 :) 但即使他们坚持认为它应该被修复，也许他们对如何应该修复它有一些想法。也许overflow: hidden或省略号的使用是可以接受的，或者他们认为最好使用自动换行来确保所有文本都可见。

无论如何，在大多数情况下，最快的解决方案是进行讨论。一点聊天通常比通过拉取请求进行沟通更具建设性。

所有元素的CSS自动换行

3 个答案: