如何使用CSS使Firefox word中断？

这是我目前的代码：

<div style="width:100px;height:100px;background:red">
            ssssssssssssssssssssssssssssssssssssss
</div>

事实证明它没有用，因为它不能在Firefox上进行文字包装。

---

使用CSS我能做什么？

您必须在div上应用以下CSS类：

.content-div{
    word-break:break-all;
    word-wrap: break-word;
}

并在div中绑定的表上添加以下样式

style='table-layout:fixed;width:306px;'

---

它将在IE7、FF 3.6和Chrome上工作。

您将宽度和显示属性与文字环绕属性一起使用：

width: 100px;
word-wrap: break-word;
display:inline-block;

它在IE和FF中对我都有效

white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
width:200px;

---

上述代码对我来说非常有用

同时使用以下规则：

/* For Firefox */
white-space: pre-wrap;
word-break: break-all;

/* For Chrome and IE */
word-wrap: break-word;

---

Firefox的工作方式如下：

word-break: initial;
word-wrap: break-word;

---

我们试试这个怎么样：

div{ overflow-wrap:break-word; }

---

这对我很有用：

/* For Firefox */
white-space: pre-wrap;
overflow-wrap: break-word;

/* For Chrome and IE */
word-wrap: break-word;

看起来溢出包装在firefox中是新事物。 更多信息可在此处找到：

---

使用下面的样式它在mozilla firefox中对我很好

word-wrap: break-word;
display:block;

---

wordbreak:break-word

已弃用。你应使用：

---

断字：正常；overflow wrap:anywhere

我需要几个答案的组合，才能让它在Chrome和Firefox中为我工作：

.white-space-pre-wrap {
  white-space: pre-wrap;
  word-break: break-all;
  word-wrap: break-word;
  display: inline-block;
}

这对我来说很好：

  /* Mozilla fix */
  word-break: break-all;

  /* Chrome fix */
  word-break: break-word;
  word-wrap: break-word;
  overflow-wrap: break-word;

---

你使用的是哪个版本的FF？由于某些原因，我需要在FF3.6上使用display:inline块。为什么宽度很关键？有可能让它使用div的宽度吗？为什么宽度很关键？有没有可能让它使用容器的宽度？这对我来说很有效，我必须添加空白：预包装！重要的；如果元素具有display:flex，则不工作。它应该是这样工作的，根据规范，他们在错误报告中说，我在半个工作日内忙着使用一些跨浏览器兼容的css样式，这是第一个真正解决我问题的解决方案。荣誉您现在可以使用

溢出换行：break word

代替

换行

，请参见@Andrej:您应该提供一个链接-答案的顺序取决于投票或您自己选择的顺序。这对我很有效，我有一个具有这些样式的类，我已将该类添加到p、a、div，以及bootstrap的4列中的其他标记“该属性最初是一个名为

word wrap

的非标准且不固定的Microsoft扩展，由大多数同名浏览器实现。此后它被重命名为

overflow wrap

，而

word wrap

是一个别名。”看起来只使用Firefox部分在Firefox和Chrome中都能很好地工作。

pre-wrap

属性会在Chrome上创建额外的空白，Chrome不会响应

word-wrap

，只响应

word-break

。

  /* Mozilla fix */
  word-break: break-all;

  /* Chrome fix */
  word-break: break-word;
  word-wrap: break-word;
  overflow-wrap: break-word;