單詞太長單選按鈕

我有一頁我們正在翻譯成德語。在頁面上是一組三個單選按鈕，水平排列。在英語中，它們顯示得很好，但是在德語中，標籤文本在右側的按鈕/標籤頂部分層顯示。由於文本只有德文的一個（很長！）字，所以換行不會影響英語語言表達的任何修復建議（例如，英文文本換行時看起來很大的頁邊空白）？下面的截圖：單詞太長單選按鈕

screenshot of problem http://img13.imageshack.us/img13/2604/germantext.png

來源

2012-05-16 shimmoril

您是否嘗試過的單選按鈕的CSS word-wrap屬性設置爲break-word？

來源

2012-05-16 14:25:06 vimist

完美！這正是我所需要的，我可以將它添加到現有的類規範中。我真的應該看看CSS3的東西，我猜:) – shimmoril

理想的，很高興我可以幫助:) – vimist

聲明'詞包裝：斷詞'真的打破了話語：它殘酷地破壞任意點的字符串。這對德語和其他大多數語言來說絕對是不正確的。這與將英文單詞「right」分解爲「ri」和「ght」（不插入連字符）一樣不正確。 –

使用soft hyphen（）。它將允許斷行，顯示連字符;但沒有另行說明。你的CSS顯然允許換行（如其他標籤所示） - 讓它爲你工作。例如。

Super&shy;cali&shy;fragi&shy;listic&shy;expi&shy;ali&shy;docious

就能呈現像

Supercalifragilistic- 
expialidocious

來源

2012-05-16 14:24:06 Amadan

我會在未來的項目中記住這一點，但在這種情況下不起作用。正如我所提到的，我們正在進行翻譯。我不知道這個詞在德語中是什麼，我沒有能力進入並添加代碼來分裂它。 – shimmoril

啊，錯過了「在飛行中」。 – Amadan

最好的解決方案是將替代（單選按鈕及其標籤）放在自己的一條線上。這對可用性和可訪問性很好，它解決了手頭上的問題。省去麻煩，而不是空間。

如果這不被認爲是可行的，請動用Amadan建議的方法。在飛行，服務器端或客戶端插入軟連字符有多種方式。查看一個demo of client-side hyphenation，即使對於混合語言內容也是如此（改變瀏覽器窗口寬度以查看效果）。演示使用Hyphenator.js。

來源

2012-05-16 16:01:16

是的，垂直與水平比較好，但我對佈局沒有任何控制。我將深入研究Hyphenator.js，但一目瞭然它不支持我們需要的所有語言，並且添加所有模式將是時間過於緊迫的。謝謝。 – shimmoril

@shimmoril，正確處理大多數語言（連字符）仍然比以嚴重破壞的方式處理所有語言（打破單詞）要好。 –

如果它實際上是_most_語言，我會同意你的意見。在我們提供給用戶的可能存在這個問題的語言（即明顯長的單詞）中，Hyphenator.js完全支持一種 - 德語。這留下了6-7種語言，根本沒有任何解決方案。當文本超出這種字段大小時，它基本上是不可讀的，因此不可用。爲了將來的實施，我會將Hyphenator放在心上，但現在單詞修復是我們產品唯一可行的解決方案。 – shimmoril

單詞太長單選按鈕

回答

相關問題