代码之家 › 专栏 › 技术社区 › Josh Katofsky

如何使包含跨距和非中断空格的标题包装整个单词

line-breaks reactjs css html

-2

Josh Katofsky · 技术社区 · 4 年前

 <h1 id="home-title">
        <span style={{ color: "#0A8399" }}>Effective Altruists</span>
    &nbsp;at&nbsp;
        <span style={{ color: "#E83C31" }}>McGill</span>
 </h1>

home-title

this 问题,没有人把整个“麦吉尔”卷到下一行。我最好的办法就是

#home-title {
    overflow-wrap: break-word;
}

这让我想到:

1 回复 | 直到 4 年前

1

0

Josh Katofsky 4 年前

我准备好了

span {
    display: inline-block;
}

以及 span 她在包装的时候不说话了。

2

-2

NajiMakhoul 4 年前

      <h1 id="home-title">
        <span style={{ color: "#0A8399" }}>Effective Altruists</span>
        &nbsp;at&nbsp;
        <br/>
        <span style={{ color: "#E83C31" }}>McGill</span>
      </h1>