移動Safari上的jquery按鈕溢出文本

我有一個jQuery Web應用程序，它在我的iPhone上看起來不錯。我剛剛在其他人的iPhone上看過它，並且他們在可訪問性中打開了加粗文本。問題在於，按鈕上的大部分文本溢出。例如，不是按鈕上的「確認」，他們的電話顯示「Co ...」，這有點無用。這是一個公司內部的網絡應用程序，所以它只需要在iPhone上運行。移動Safari上的jquery按鈕溢出文本

任何想法如何解決這個問題？

來源

2016-09-29 Brad

卸下'溢出：hidden'或從按鈕等效。 – aardrian

在你的css元素中使用相對單位（em，rem）尺寸可以幫助防止這種情況發生。同時避免在元素上使用設置寬度，因爲溢出的文本可能會被截斷。

WCAG AA標準規定，用戶必須能夠在不丟失內容或功能的情況下將文本大小調整到200％，因此確保任何按鈕隨文本增加而增長很重要。您可以消除可能在按鈕上的任何設置寬度，否則它們應該相對於其中的文本擴展。在WCAG標準

源：https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-scale.html

來源

2016-09-29 13:27:15 Skerrvy

感謝@Skerrvy。這是很好的建議，但我不知道如何實現，因爲我使用jQuery作爲庫來呈現所有文本。你能指出我正確的方向嗎？乾杯 – Brad

這個小提示是說明第二點（當字體大小增加時，如何設置高度/寬度將切斷文本：https：//jsfiddle.net/ym1nb48u/3/0。第二個鏈接說明了第一點（使用相對單位）來放大尺寸，因此當頁面被放大時，所有元素都以相同的比例縮放：https：//jsfiddle.net/ym1nb48u/4/ – Skerrvy

移動Safari上的jquery按鈕溢出文本

回答

相關問題