3

だから私はこのコードを持っています:

<span readonly="true" id="textarea" cols="60" rows="1">
  <pre style="{display:inline; white-space: pre-wrap; word-wrap:break-word;}"> SOME TEXT HERE </pre>
</span>

私には2つの問題があります。1つは、スペースや改行のない非常に長い文字列を導入する場合です。例:

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

Firefoxとオペラでは、正常に表示されます。

aaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaa 

クローム、IE、サファリでは次のように表示されます。

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa 

画面を終了します

助けが必要です。ああ、2番目の問題は、chrome、IE、safariでは、インラインで表示する代わりに、display:inlineと書いてもブロックが表示されることです。

解決済み:使用する代わりに、最初からインラインになります。そして、皆さんが言ったように、私は{}を取り出して、うまくいきました!ありがとうございました

4

2 に答える 2

3

幅を定義していないためだと思います。私の経験word-wrapでは、ブロック要素でのみ機能します(inline-blockラップしてインラインにする必要がある場合は設定できます)。

aの属性を持つapre内に aを配置していることも奇妙です。spantextarea

http://jsfiddle.net/A2MNN/

HTML:

<pre>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa.
</pre>

CSS

pre{
    width:40em;
    word-wrap:break-word;
    white-space:pre-wrap;
}
于 2012-05-24T15:17:50.933 に答える
1

ブラウザが処理する準備ができていない方法でマークアップが無効であり、スタイル シートが CSS 規則に違反しています。これは、ブラウザがガベージを表示することを期待する必要があることを意味します。異なるブラウザでは異なるガベージが表示される可能性があります。

実際の問題について助けを得るには、問題 (特定されていない問題を解決するための完全に壊れた方法ではない)、つまり達成したいことを説明し、それを解決するための最善の試みを完全かつ有効な HTML ドキュメントとして示す必要があります。 .

于 2012-05-24T17:34:15.477 に答える