ChromeおよびFirefoxでフォームを選択した際のフォーカスの線(アウトライン)を消す方法

テキスト入力エリアで入力するときにフォームの枠線がでるじゃないですか。今は青い枠線。
あれってユーザビリティ的にはあって親切なものだと思うけど、青色固定されるとサイトのデザインによっては壊滅的にあわなかったりすので、色を変更したくなるときがあります。

例)

このフォーカスを消したいときは、以下のようにoutline:noneを指定します。

div.form input:focus,
div.form textarea:focus {
  outline: none;
}
■適用後

このフォーカスの消し方を調べたときに、ほとんどのサイトでinput[type="text"]を指定する方法ばかりでしたが、現在のChromeでは効きませんでした。
ブラウザがヴァージョンアップされていくたびに仕様が変わっていくので、この紹介した方法もいつかは効かなくなるかもしれません。