レスポンシブデザインでの未亡人（1行の単語）の対処方法

Question

誰かがこの問題に直面したかどうかはわかりません。

基本的には、私たちのウェブサイトに段落があると想像してください。最後の行に1行の単語があると奇妙に見えます。

他の2つの単語の組み合わせである1つの単語、つまり行末にあるもの、次の行の先頭にあるもの（特に日本語では多く発生します）。

これを取り除く（または何とかして見栄えを良くする）最も効率的な方法は何でしょうか。

Answer 1

おそらく<span class="nowrap"></span>に2語の単語をラップし、.nowrap{white-space: nowrap;}でスタイル付けすると、その問題が解決されます。

段落内の末尾の単語までは、私が知っている簡単な解決策はありません。私がお勧めするのは、すべての主要なデバイスブレークポイント（1440,1366,1280,1024,764など）のためのメディアクエリを作成し、手作業でフォント、余白、パディングなどをスタイリングして、醜いワードラッピングがないことを確認することです。