0

ここでストローを握りしめていますが、Firefox 3.0.7 でテキストをラップするための解決策を見つけた人はいますか?

他のブラウザーと同様に、テキストはコンテナー内で折り返す必要があります。

例: http://jsfiddle.net/4t7Ut/ (明らかに FF3.0.7 で表示)

#container {
    border: 1px dashed;
    width: 100px;
}

.text-to-wrap {
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}

...

<div id="container">
<div class="text-to-wrap ">VWvU3dpVq5wJio6oFE82pmQuBTRzbii4dLd4NGBr332V2P4Skx8GwLozZrczNoRPmqWSrxnLEKh5PBZ6s3AjMFX3ftLHyuR7RGSA</div>
</div>
4

2 に答える 2

1

各行ができるだけ多くの文字を含む行に分割されるようにコンテンツを折り返すには (もちろん最後の行を除く)、<wbr>テキスト コンテンツの各文字の後に タグを追加して、 Firefox 3 のような古いブラウザーでも、このように動作します。この目的のために、クライアント側のスクリプトを使用できます。

<script>
var cont = document.getElementById('container').getElementsByTagName('div')[0];
cont.innerHTML = cont.innerHTML.replace(/(.)/g, '$1<wbr>');
alert(cont.innerHTML);
</script>

このような破損を許可することはほとんどありません。人間の言語にもコンピューターの言語にも、独自の改行規則があります。そのため、<wbr>タグは手動で、またはコンテンツに適したアルゴリズムを使用して、適切な位置にのみ挿入する必要があります。

の代わりに<wbr>、対応する文字レベルの ZERO WIDTH SPACE ( &#x200b;) を使用することもできます。非常に古いブラウザではサポートされていませんが、Firefox 3 では問題ないようです。

于 2012-10-30T12:57:50.697 に答える
0

それを試してみてください：

に使用width:100%; display:inline-block;する.text-to-wrap

于 2012-10-30T10:51:51.983 に答える