1. ホーム
  2. html

[解決済み] 固定幅のスパンで長いテキストや単語を折り返すには?

2022-09-12 17:37:45

質問

固定幅のスパンを作りたいのですが、スパン内に何か入力したときに <span>lgasdfjksdajgdsglkgsadfasdfadfasdfadsfasdfasddkgjk</span> のような、スペースを取らない長い文字列を入力すると、単語が改行されるか、次の行に折り返されます。

何かアイデアはありますか?

どのように解決するのですか?

CSSプロパティである word-wrap:break-word; というプロパティを使用すると、スパンの幅に対して単語が長すぎる場合、単語を分割することができます。

span { 
    display:block;
    width:150px;
    word-wrap:break-word;
}
<span>VeryLongLongLongLongLongLongLongLongLongLongLongLongExample</span>