チェックボックスやラジオボタン（input[type=checkbox]など）のアクセシビリティとデザインの両立

よくあるのが、

input[type=checkbox] {

  display: none;

}

input[type=checkbox] + label {

  スタイル

}

でもこれだと、tabキーで選択できなくなってしまう。
試してみたけどいい方法がない模様

input[type=checkbox] {

  width: 0;

  height: 0;

  padding: 0;

  margin: 0;

  opacity: 0;

}

FFはwidth, height=0でも表示されてしまう。

opacity: 0;で透明に

IE、Chrome、FFで確認してみた、他のブラウザは確認してない。

なんかダメだった気がする。

→いい方法探す。