div内のブラウザ間のテキストフロー

単語を分割しない div 内にテキストを流し込むにはどうすればよいですか?私はこれがSafariとChromeですが、MS IEやFirefoxでは実現できません。

Safari/Chromeの出力例:

An emergency lighting survey to be conducted. The emergency lighting system
is to inspected by a competent electrical engineer and any recommendations
following such an inspection are to be implemented.

MS IE/Firefoxの出力例:

An emergency lighting survey to be conducted. The emergency light
ing system is to inspected by a competent electrical engineer an
d any recommendations following such an inspection are to be imp
lemented.

使用されるコード:

<div style="width: 100%; word-break:break-word">
    

<?php echo $row['observation']; ?>

</div>

どんな助けでも大歓迎です。

0
nl ru de
IE9またはFFでこれを再現できません。この例を拡張して問題を再現することができますか?
追加された 著者 Jeroen,
Pタグにスタイルがありますか?このように私は説明された効果を見ることができません。
追加された 著者 axel.michel,
なぜ work-break:break-word を使用するのですか?
追加された 著者 Passerby,
word-break:break-word を削除してください。すべてのブラウザでのデフォルトの動作は、単語を分割することではありません。
追加された 著者 Bazzz,
Pタグにスタイルがなく、単語区切りを使用する理由は、私が問題の解決策を探していてストローで握っていたことです。私は今、単語の区切りを削除してもまだ改善されていないし、サファリとクロムはmsieと同じように見える
追加された 著者 FireNet,
多くのありがとうございましたJeroen私はどちらかといえば私はそれをpxの代わりに%でテーブルに入れました。 CSSのどこかに矛盾がなければなりません。調査して戻ってくるでしょう
追加された 著者 FireNet,
問題が解決しました。 Jeroenの再現の後、私はCSSをさらに見て、word-break:break-wordもそこにあったことに気付きました。私はこれをコメントアウトし、私の部門内で同じものがなければ、今は期待どおりに働いています。もう一度あなたの助けに感謝します。
追加された 著者 FireNet,

1 答え

5.3。文字のルールを破る: '単語分割'プロパティには、 break-word という値はありません。しかし、あなたは 6.2を持っています。オーバーフローラッピング: break-word を提供する 'word-wrap'/'overflow-wrap'プロパティ

名前:オーバーフローラップ/ワードラップ
  値:正常|ブレーク・ワード
  ...
  'ブレーク・ワード'
      そうでなければ受け入れ可能なブレークポイントがラインにない場合、破られない "単語"は任意のポイントで壊れるかもしれません。シェイピング文字は、まだ単語が壊れていないかのように形作られており、書記素クラスタは一緒に1つの単位として存在する必要があります。ハイフネーション文字はブレークポイントに挿入されません。

0
追加された