2016-09-29 7 views
0

私のiPhoneで素晴らしいと思われるjquery Webアプリケーションがあります。私はちょうど他の誰かのiPhoneでそれを見て、太字のテキストがアクセシビリティでオンになっています。この問題は、ボタンのテキストの多くがオーバーフローすることです。たとえば、ボタンの「確認」ではなく、「Co ...」と表示されますが、これは少し役に立たないものです。これは会社内のWebアプリケーションなので、iPhoneで実行するだけです。モバイルSafariのjqueryボタンにオーバーフローしているテキスト

これに対処する方法はありますか?

+0

'オーバーフローを削除します。 – aardrian

答えて

1

css要素のサイジングで相対単位(em、rem)を使用すると、これが起こらないようにすることができます。また、オーバーフローするテキストが途切れてしまう可能性があるため、要素に設定幅を使用しないようにしてください。

WCAG AA基準では、コンテンツや機能を失うことなく最大200%のテキストサイズを変更できる必要があるため、テキストの増加に伴ってボタンが大きくなることを確認することが重要です。ボタン上にある可能性のある設定幅を削除することができます。そうでない場合は、その内側のテキストに対して相対的に展開する必要があります。 WCAG基準に関する

ソース:ボタンからhidden`または同等:https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-scale.html

+0

この@Skerrvyに感謝します。それは素晴らしいアドバイスですが、私はそのテキストをすべてレンダリングするためにjQueryをライブラリとして使用しているので、それを実装する方法がわかりません。あなたは私を正しい方向に向けることができますか? Cheers – Brad

+0

このフィドルは2番目のポイントを示しています(フォントサイズを大きくすると、高さ/幅をどのように設定してテキストを切り取ることができますか): この2番目のリンクは、 (相対単位を使用して)サイズを調整してページを拡大すると、要素はすべて同じ比率で拡大/縮小されます:https://jsfiddle.net/ym1nb48u/4/ – Skerrvy

関連する問題