Chromeはword-break:break-allが効かない overflow-wrap:break-wordに
2015-03-06 カテゴリ:ソフトウェア タグ:Chrome、CSS、overflow-wrap、word-wrap
HTMLでは文字の折り返しをCSSのword-breakで制御する。単語を維持するとか、折り返さないとか、いろんな形に制御できる。
多くの場合、特に指定せずともブラウザのデフォルト値で問題ない。だけど、長いURLを記述したときなんかに、文字が領域からはみ出してしまうことがある。ブラウザがその文字列をひとつの英単語として認識し、折り返さずに表示しようとするからだ。
こういうときに、word-break:break-all を指定すると、幅に応じて全ての文字が折り返される。
しかし、Chromeではこの指定が有効にならない場合があるようだ。あるサイトで、記号でできた長い文字列が折り返されず、領域外にはみ出すという現象が起きてしまった。
調べてみると、そもそもword-break自体が文字の折り返しではなく、文章の改行について制御するためのものなんだって。文字の折り返しを制御するにはword-wrapってのを使えばいいらしい。
2つ目のプロパティにword-wrapとoverflow-wrapを併記していますが、これは現在策定中のCSS3仕様案ではword-wrapからoverflow-wrapへと改称されたためです。Internet ExplorerやFirefoxでは未だ新しいoverflow-wrapのプロパティ名称がサポートされていないため、overflow-wrapを用いる場合は、後方互換性のためにword-wrapの名称も一緒に記載する必要があります。
まあなんにせよoverflow-wrap:break-wordとword-break:break-allを指定しておけば大抵の場合は大丈夫そうだ。
- Chronicon ローカルマルチプレイでの二人目以降の効率的な育成法
- Ghost Recon Breakpoint ベヒモスがまたリスポンするようになった!
- Chronicon ストーリークリアしてエンドコンテンツを始めた
- Chronicon クリスタルパズルの解き方
- Apex Legends ダイヤ到達までの記録
- Apex Legends シーズン8、ソロでダイヤまでランク上げた
- ExcelのDSUM関数でcsvやxlsxから条件群に合致する値の合計を算出する方法
- 無印良品の紳士向けコート
- Windows7とWindows10の推奨スペックを比較
- WordPressでパーマリンクに「_(アンダースコア)」を使う方法
- GrimDawn 報復サヴィジリヴィンディケイター
- WordPressでExec_phpとかで埋め込んだphpソースが自動でコメントアウトに変換されるときの対処法
- GrimDawn クリダメトロザンドルイド
- GrimDawn 刺突変換報復タクティシャン
- GrimDawn アルコンズウォーモール2H近接FSコマンドー
- GrimDawn ウォードンおじさん低レベル撃破実績解除
- GrimDawn ルーンバインダーエレメンタルメイジハンター
- Googleマップのタイムラインからストリートビューを使う方法
- GrimDawn ウルトス2H近接エレメンタリスト
- GrimDawn サバターさん、うっかり強くなってしまう
- GrimDawn エレメンタル→生命力変換ウォーロック
- GrimDawn 冷気コルバトリックスター
- GrimDawn オクタヴィウス1H物理フォースウェイブタクティシャン
- GrimDawn 闇き者生命カバリスト坩堝対応版
- GrimDawn MIマラソン1時間コース
- GrimDawn ジャナクシアのMI掘りが楽しい
- GrimDawn DarkOne生命カバリスト
- GrimDawn Dark Oneセットが揃わねえ
- GrimDawn クリーグセットバトルメイジ
- GrimDawn イーサー2刀カデンツバトルメイジ
- GrimDawn 全15クラスを85にした
- amazonプライムビデオの視聴履歴の場所
- GrimDawn 高DAビルド
- GrimDawn サラザールの聖域で謎の鍵が落ちまくった
- GrimDawn 近接2刀ウンコパンツウィッチハンター
- iPad Pro買おうかと迷ってたらなぜかAdobe CCを買っていた
- 怖い夢の典型的な例
- GrimDawn クリダメ特化イーサーレイバトルメイジ
- GrimDawn ダメージ反射とかいう罠
- GrimDawn ウォーボーン2刀カデンツブレマス
- 映画「エスター」ネタバレ感想
- GrimDawn カオスストライクパイロマンサー
- GrimDawn 1キャラの育成にかかる時間
- GrimDawn 冷気雷トロザンドルイドを育成中
- GrimDawn スタンジャックスエレメンタリストのビルド例
- GrimDawn 出血トリックスターを育成中
- GrimDawn カオス火炎コマンドー改訂版
- GrimDawn 報復バトルメイジのビルド例
- GrimDawn 比較的簡単に10万ダメージを出す方法
- GrimDawn コマンドーをカオス火炎ビルドに変えた
- 2021年7月
- 2021年6月
- 2021年3月
- 2020年3月
- 2019年12月
- 2019年11月
- 2019年6月
- 2019年4月
- 2019年2月
- 2018年9月
- 2018年8月
- 2018年7月
- 2018年6月
- 2018年3月
- 2018年2月
- 2018年1月
- 2017年12月
- 2017年11月
- 2017年9月
- 2017年7月
- 2017年6月
- 2017年5月
- 2017年4月
- 2017年2月
- 2017年1月
- 2016年12月
- 2016年11月
- 2016年10月
- 2016年9月
- 2016年8月
- 2016年7月
- 2016年6月
- 2016年5月
- 2016年4月
- 2016年3月
- 2016年2月
- 2016年1月
- 2015年12月
- 2015年11月
- 2015年10月
- 2015年9月
- 2015年8月
- 2015年7月
- 2015年6月
- 2015年5月
- 2015年4月
- 2015年3月
- 2015年2月
- 2015年1月
- 2014年12月
- 2014年11月
- 2014年10月
- 2014年9月
- 2014年8月
- 2014年7月
- 2014年6月
- 2013年12月
- 2013年11月
- 2013年10月
- 2013年9月
- 2013年8月
- 2013年7月