文章の折り返し指定のCSS最新版 - ICS MEDIA

文章の折り返しはウェブ制作において意外と難しいものです。URLが文章に含まれている場合、URLがレイアウトを突き抜けてしまった、という経験をみなさんはお持ちではないでしょうか？ この記事では、国内のウェブ制作において「開発者が考えることが少なくてよくなる」安全なCSS指定を紹介します。 結論から説明すると、以下の指定を提案します。 body { overflow-wrap: anywhere; /* 収まらない場合に折り返す */ word-break: normal; /* 単語の分割はデフォルトに依存 */ line-break: strict; /* 禁則処理を厳格に適用 */ } この記事では上記の指定にいたった理由と、折り返しの理解について必要なoverflow-wrapとword-breakプロパティを中心に解説します。 overflow-wrap overflow-wrapは

[mohri]

「word-wrapプロパティは過去にInternet Explorer向けに開発されたもので、現在はoverflow-wrapという名前に改名されています」

[moqojiy]

「収まらない場合に折り返す」はデフォルトでそうなっとけよ、なんでそうならないだよと思わないでもない。

[kns_1234]

"word-wrapプロパティは使わない。使いたいならoverflow-wrapプロパティを使う"

[Shinwiki]

自分がここで折り返して欲しいというとこに指示置いて相手にそうさせようとするその根性が人間社会に向いてないと思うので嫌いなやつ。

[ducktoon]

ややこしすぎる

[sabotem]

line-break: strict; 知らなかった

[kkeisuke]

“overflow-wrap: anywhere”