折り返し候補の位置を指定したいときにwhite-space: nowrap;で改行禁止にしたうえで、<wbr>タグの位置でのみ改行を許すという方法。
PC,SPともにFirefoxには有効でないようです。
正確には<wbr>タグが効きません。
改行されずはみ出してしまいます。
word-break: keep-all;を使おう
<style type="text/css">
p{
/* white-space: nowrap; */
word-break: keep-all;
}
</style>
<p>hoge<wbr>fuga</p>大きな修正なくモダンブラウザに対応させるためには、<wbr>タグ+white-space: nowrap;を<wbr>タグ+word-break: keep-all;に変更すればOKです。
この方法であれば、<wbr>タグを含むhtml文書を書き換える必要もありません。
違いと副作用について
word-break: keep-all;は、<wbr>タグの他に記号や半角スペースの位置でも改行を許す指定になります。
なので、それらが含まれる(かつそこでは改行したくない)文章をword-break: keep-all;に書き換えると、その部分で改行される可能性があります。
参考：word-break – CSS: カスケーディングスタイルシート | MDN
