帶預包裝的谷歌Chrome缺陷

我試圖實現的目標是在文本區保留序列空格，並且在行末尾處未打破單詞。帶預包裝的谷歌Chrome缺陷

所以根據這一點： http://www.w3schools.com/cssref/pr_text_white-space.asp

當我們設置

white-space: pre-wrap;

的空格應予以保留，並在年底的話不分裂。

但是，正如這個jsfiddle所示，谷歌瀏覽器並不保留空白序列（textarea中有很多空格，但chrome顯示較少，請注意其他瀏覽器是如何顯示它們的，但chrome不是）。

http://jsfiddle.net/LXUEe/2/

有沒有辦法解決這個問題？

我可以通過保持空格：

white-space: pre;

但後來所有的長詞在該行的結束分裂（雖然只有鍍鉻...）

有沒有什麼解決辦法嗎？

在此先感謝！

編輯：嘗試不斷地在該jsfiddle的某一行輸入空格。當光標到達最右端並且不會進入下一行時（chrome），光標將被刪除。（Chrome）

來源

2013-02-03 MIrrorMirror

您可以發佈的Chrome瀏覽器26火狐18 – OneChillDude

看起來相同的截圖我相信@MIrrorMirror要求是基於Webkit的瀏覽器，包括Chrome和Safari，使得文本區域不同於非WebKit瀏覽器。要查看它們的區別，請在Webkit和非基於Webkit的瀏覽器中檢出[this fiddle]（http://jsfiddle.net/LXUEe/6/）。請注意，在非webkit瀏覽器中，最後一個單詞「break」不可見，因爲textarea的大小不足以容納所有字符。然而，在webkit瀏覽器中，這個詞是可見的，因爲一些空格（導致換行符）被摺疊。我不知道這是一個錯誤還是一個功能，但它確實呈現不同。 – Mooseman

你想 –

我想說Chrome是唯一正確跟在W3C recommendations之後的瀏覽器。

看第二點4

如果空間（U + 0020）或翼片（U + 0009）在一個行的末尾具有 「空白」設置爲「預包裝'，UA可能會將它們視覺崩潰。

希望有所幫助。

來源

2013-02-06 08:30:03

謝謝你很有趣。如果是這樣的話，我們應該如何擁有一個文本區域：a）不在行尾處打破單詞，b）不折疊空格，而是將它們移動到下一行？ – MIrrorMirror

但是我應該說，這個w3c建議與他們給出的半個頁面的定義相抵觸「pre-wrap 這個值可以防止用戶代理破壞空白序列。行被破壞保存的換行符，並且必要時填充行符「。 – MIrrorMirror

一個解決方案將使用「white-space：pre;」但在谷歌瀏覽器，在行結束時打破了話。 – MIrrorMirror

帶預包裝的谷歌Chrome缺陷

回答

相關問題