質問
長い行が含まれていても、XULアプリケーションでラップして説明を取得しようとしています。
たとえば、次を.xulファイルとして保存し、Firefoxで開くと、見た目が良く、適切にラップされます。
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window
id="theWindow"
title="The Window"
style="overflow: auto;"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:html="http://www.w3.org/1999/xhtml"
>
<vbox flex="1" style="max-width: 200px; overflow:auto; border: 1px dotted black; padding: 2px;">
<description style="border: 1px solid black; padding: 2px;">test</description>
<description style="border: 1px solid black; padding: 2px;">test test test test test test test test test test test test test test test test test test test test test</description>
</vbox>
</window>
ただし、大きな行のスペースを削除しても折り返されず、スクロールバーで行が表示されます。
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window
id="theWindow"
title="The Window"
style="overflow: auto;"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:html="http://www.w3.org/1999/xhtml"
>
<vbox flex="1" style="max-width: 200px; overflow:auto; border: 1px dotted black; padding: 2px;">
<description style="border: 1px solid black; padding: 2px;">test</description>
<description style="border: 1px solid black; padding: 2px;">testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</description>
</vbox>
</window>
CSSなどを使用して、長い行が200ピクセルの制限に達したときに折り返すように強制する方法はありますか?
解決
Firefox 3.1はこれをサポートしています: http://www.css3.info/preview/word -wrap /
word-wrapプロパティはMicrosoftによって発明され、CSS3に追加されました。これにより、長い単語を分割して次の行に折り返すことができます。 2つの値を取ります。通常またはブレークワード。 現在、IE、Safari、Firefox 3.1(Alpha)でサポートされています。
古い(および現在の)バージョンのFirefoxには、標準的な方法(Googleは私の友人でした)がありません。単語の途中に<br />
を追加する小さなスクリプトを使用することを提案する人もいます。 word-wrap:break-word を使用して、ユーザーが最終的にアップグレードすることを期待します。
他のヒント
元々、ChatZillaは空の<!> lt; img <!> gt;を散乱させていました。長い単語が折り返される可能性のあるポイントとして機能する要素を出力に追加しますが、これは後で<!> lt; wbr <!> gt;に変更されました。要素。
所属していません StackOverflow