CSS break-wordで単語の途中で改行するサンプル
環境
Windows 10 Home 64bit
Google Chrome 107.0.5304.122(Official Build) (64 ビット)
構文
overflow-wrap: break-word;
単語が表示領域を超える場合、単語の途中で改行します。
使用例
<!DOCTYPE html> <html> <head> <style> .cft { overflow-wrap: break-word; border: 1px solid #000; width: 120px; height: 30px; background: SkyBlue; } </style> </head> <body> <p class="cft">study skill become</p> </body> </html>
結果
文字「become」横にはみ出さないように改行されます。