white-space: nowrap
と <wbr>
使ってる所が IE で崩れてたので調べました。
.nobreak { word-break: keep-all }
.nobreak wbr::before { content: "\200B" }
参考記事
- https://qiita.com/unarist/items/8b0e9941f340f26695eb
- https://css-tricks.com/forums/topic/zero-width-space-after-hyphen/
追記 1
white-space: nowrap
は Firefox で wbr が効かない。
→ word-break: keep-all
を利用
サラっと流しててまた同じ事?してハマったので追記。
追記 2
ブラウザ(Firefox と Google Chrome)で改行位置が異なったので、
有る程度ブラウザチェックもして置いた方が良いです。
具体的には括弧 「」
前後で発生していました。
恐らくブラウザ間での禁則処理の違いが原因。
// 解決方法など有りましたらシェアくださいませ。