web-dev-qa-db-ja.com

CSSワードラップ：IE9でブレークワードが機能しない

<a>タグを強制的にdivでワードラップする小さなcssスクリプトがあります。 FFでは正常に動作しましたが、Chromeでしたが、IE9では動作しませんでした。どうすれば修正できますか？

.tab_title a{
    Word-wrap: break-Word;
}
cssinternet-explorerword-wrap
24
hungneox

.tab_titleクラスの後にアンカータグを削除すると動作します

3
hungneox

同様の問題については、display: inline-block上の<a>タグ、これは役立つようです。そしてWord-break: break-all私は長いURLがラッピングしないことに関心があったので。

したがって、これは本質的にあなたの場合...

.tab_title a {
    display: inline-block;
    Word-break: break-all;
}
25
Si Clancy

これはトリックを行うかもしれません： http://www.last-child.com/Word-wrapping-for-internet-Explorer/

別の投稿では、Word-break:break-allおよびWord-wrap:break-Wordそれに。

11
Duke Hall

私にとっては、ChromeとIEで：

.Word-hyphen-break {
  Word-break: break-Word;
  Word-wrap: break-Word;
  width: 100%;
}

このように、特定の幅を設定する必要はありません。

9
anniete

これを試して：

.tab_title a{
    -ms-Word-break: break-all;
    Word-break: break-all;
    Word-break: break-Word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}
7
Danny Connell

Word-wrap: Word-break;はffおよびchromeでのみ動作し、IE8およびIE9では動作しません。
Word-break: break-all;も機能しません。

3
Prachi

Chrome、Firefox、およびIEを使用して成功しました：

Word-break: break-Word;
Word-wrap: break-Word;

私の問題の場合、私は使用していました：

display: table-cell;

含めなければならなかった

max-width: 440px;

すべてのブラウザでラッピングを取得します。ほとんどの場合、max-widthは必要ありません。を使用して

Word-break: break-all;

IEではうまく機能しない.

1
Darren Reimer

最近、IEとEdgeとChromeの間でAngularでこれと戦っていました。

  overflow-wrap: break-Word;
  Word-wrap: break-Word;

これにより、両方の長所が得られました。長すぎるWordが破損しますが、Word-breakとは異なり、Wordの途中で破損することはありません。

0
GR Envoy