次の HTML コードがあります。
<a href="https://www.nothing.com/link" style="font-size:42px;text-decoration:none; color: #FFFCFC;white-space:nowrap;">this is just a <i>test sentence</i></a>
ご覧のとおり、ブラウザー ウィンドウのサイズに関係なく、文が 1 行に収まるように "white-space:nowrap" を挿入しました。ただし、文の一部の単語をイタリック体にすると、これが発生しなくなるようです。小さいブラウザ ウィンドウでは、結果は 1 行に「this is just a」、次の行に「 test statement 」となります。文が常に 1 行に収まるようにするにはどうすればよいですか?
イタリックは行の折り返しを引き起こしません。問題は、質問で開示されなかったスタイルシートの一部にあります（投稿されたコードは問題を示していません）。これは「キラーCSSリセット」である可能性があり、実際に混乱する傾向があります。これは、のようなものである可能性があります。これにより、親から継承させるのではなく* { white-space: normal }、要素内で通常の行の折り返しが自然に発生します。iwhite-space
したがって、CSSの使用をクリーンアップする必要があります。できれば、「CSSリセット」を削除する必要があります。本当にリセットする必要があるプロパティだけをリセットします。
inline-block少なくともクロムで動作する href に追加してみてください
<a href="https://www.nothing.com/link" style="font-size:42px;text-decoration:none; color: red;white-space:nowrap;display:inline-block">this here is a very long is just a<span style="font-style: italic"> test sentence</span></a>