ラジオボタン/チェックボックスのアクセシビリティの問題

Question

このアプリケーションでは、UI用にトリニダードJSFを使用しています。 ユーザーがアプリケーションにログインすると、レコードのテーブルにページが表示されます。レコードを選択するために、レコードごとにラジオボタンが表示されます。 ユーザがラジオボタンのグループにタブすると、ラジオボタンの周りにデフォルトの点線が表示されます。また、上下矢印キーを使用してラジオボタンのグループ内をユーザーがナビゲートすると、選択したラジオボタンにデフォルトの点線が残ります。このシナリオは大丈夫です

ユーザーはアプリケーションにログインし、レコードのテーブルとともにページが表示され、ユーザーはマウスボタンでラジオボタンを選択しました。ユーザーは、ラジオボタンの周囲にデフォルトの点線が表示されないことを確認しました。これは、フォーカスがラジオボタンでアクティブでないことを意味します。

なぜマウスボタンでラジオボタンに点線が表示されないのですか？

ブラウザ：IE 8.

貴重なコメントをお書きください。マウスクリックがアウトラインを有効にしない場合

<table> 
<tr> 
<td class="x7f xbd"> 
<input name="cardholderList:selected" id="cardholderList:0" title="Select" type="radio" value="0"> 
</td> 
... 
</tr> 
<tr> 
<td class="x7f xbd"> 
<input name="cardholderList:selected" id="cardholderList:1" title="Select" type="radio" value="1"> 
</td> 
... 
</tr> 
<tr> 
<td class="x7f xbd"> 
<input name="cardholderList:selected" id="cardholderList:2" title="Select" type="radio" value="2"> 
</td> 
... 
</tr> 
</table> 

Answer 1

以下のような

レンダリングされたHTMLフォーム、それは彼らに自分のスタイルをする必要があります。

a:active{outline:none;} 
a:focus {outline: 2px solid green;}