11

次のコードがあります。

<html>


<style type="text/css">

DIV { display:inline; border: solid red 1px; }

.editable { background:yellow; }

</style>


<div class="editable" contentEditable="true"> This is test text. This is test text.This is test text.This is test text.This is test text.Thihis is test text.This is test text.</div>

<div class="editable" contentEditable="true"> short </div>

<div class="editable" contentEditable="true"> This is test text.This is test text.This is test text.his is test text.Thihis is test text.Thihis is test text.Thihis is test text.Thi </div>

そして、div から contentEditable="true" を削除すると、テキストを正しくラップするために IE7 (IE6 は必要なく、FF3.x は正常に動作します) が必要です。このコードを contentEditable の有無にかかわらず試してみると、私の言いたいことがわかるでしょう。ブラウザー ウィンドウを十分に小さくして、テキストがどのように折り返されるかを確認します。

ありがとう。

4

7 に答える 7

1

デモ: http://jsbin.com/icavu4

これを試してみてください。問題を少し解決するのに役立ちます。

<!--[if gte IE 7]>
<style type="text/css">
.editable {
    overflow:hidden;
    float:left;
    height:20px;
    border: solid red 1px;
    background: yellow;
}
</style>
<![endif]-->

更新しました：

これは部分的に回避策と見なすことができるため、FF のように表示できますが、テキストの最後の部分が切り取られます。JavaScript を少し使用して、ホバー時に編集するテキスト全体を提供することをお勧めします。

于 2010-09-29T19:24:47.367 に答える
0

ああ、私の！IE Developerツールバーは、悪名高いプロパティcontentEditableをトリガーすることを明らかにしますlayout

レイアウトがあるということは、基本的に要素が長方形であることを意味します。

を強制するいくつかのハックがありますが、実際にそれを削除するlayout方法はないと思います。:(

于 2010-09-01T20:20:45.493 に答える
0

divに使用しないのはなぜdisplay: blockですか？

inline-block本当にインラインにする必要がある場合は、次のように使用することもできます。

http://www.brunildo.org/test/InlineBlockLayout.html quirksmode によると、IE 6 および 7 でのサポートはこれに対して不完全であることに注意してください。

例: http://jsfiddle.net/SNzBn/

于 2010-09-09T10:05:29.493 に答える
0

簡単な回答:display:inline-blockの代わりにを使用するとdisplay:inline、他のすべてのブラウザーが IE のように動作します。

詳細: IE9 も同じように動作します。SPAN は、本来あるべき と同じようDIV {display: inline}に動作します。Pumbaa80 の 9 月 1 日の応答は最高のものです。基本的に、ContentEditable は IE では長方形でなければなりません。したがって、SPAN と DIV の両方が次のようにレンダリングされます。display:inline-blockIEで。私はコンテンツ管理システムで常に ContentEditable を使用しています。この「機能」を利用して、編集可能な DIV が最初は空のときにユーザーが作業できるスペースを確保します。あなたの例では、「短い」のすべてのテキストを削除すると、カーソルを要素に戻してテキストを元に戻すことができます。何も折りたたまれません。CMS では、ユーザーが編集モードまたはプレビュー モードを選択したかどうかに応じて、ContentEditable のオンとオフを切り替えます。同時に、インラインとブロック/インライン ブロックの表示を切り替え、編集ガイド (赤い境界線) のオンとオフを切り替えます。...トム

于 2010-10-02T06:24:24.550 に答える
-1

オーバーフロープロパティを試しましたか?

于 2010-01-12T11:52:39.747 に答える
-1

DIV の代わりに SPAN を使用しようとしましたか?

SPAN タグはインラインであり、display:inline は必要ありません。

申し訳ありませんが、試していませんが、現時点では IE7 を持っていません。

于 2010-09-23T20:26:40.890 に答える
-2

親愛なる友人、IE のすべてのバージョンにはいくつかの欠点があります。特にスタイルシートの解析において。バージョン sytle ルールごとに変更する必要があります。バージョンごとにスタイルルールを使用する必要があることをお勧めします。すなわち。IE スタイルのハック。私の知る限り、IE 6 バージョンは IE のすべてのバージョンで最適です。スタイルシートに書いたものを正しく表示します。

于 2010-09-29T11:58:20.707 に答える