CSS3:IE10からテキストフィールドに勝手に入る×ボタンを消す

goto_jp 2,955views 更新:2014年10月23日

IE10以降からテキストフィールドに入力すると、クリアするための×ボタンが勝手に入ります。

これはCSSで消すことができます。

input[type=text]::-ms-clear {
    display: none;
}

「ms-clear」の擬似要素が×ボタンに当ります。

type=password のパスワードフォームも似たボタンが付きますが、同様に下記のCSSで消せます。

input[type=password]::-ms-reveal {
    display: none;
}

ちなみに余談ですが、IE10でIE8のエミュレートモードを入れた状態だと、
「本体はIE10だから×ボタンは出るけど、解釈はIE8だからCSSは効かないので×ボタンが消せない」
という状態が発生します。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

1件のトラックバック

こちらもお役に立つかもしれません