css - Chrome で明らかに削除できない input type="search" 境界線を削除する方法

Question

私はかなりのことを試しました...しかし、境界線は消えません. type="search" を type="text" に置き換えれば問題なく動作しますが、それが私に求められていることではないことを願っています。

私はそれを殺そうとしています

input{
    background:transparent;
    border:0;
    border-color:transparent;
    outline:none;
    width:150px;
}​

しかし、それらのどれも仕事をしていないようです。

http://jsfiddle.net/Kf9Mu/

何か案は？

Answer 1

どうやらWebkitには検索入力フィールドのカスタムスタイルがあります。あなたはそれを直接取り除き、そしてあなた自身の境界線を適用することができます。ここで削除して、赤い境界線を付けました。

input{
  -webkit-appearance: none;
  border: 1px solid red;
}​

http://jsfiddle.net/Kf9Mu/7/

私はこれをChromeでしか見ていません。

Answer 2

試してみてください

-webkit-appearance: none;

http://37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkitも参照してください

Answer 3

これを試して：

input:focus {
    outline: none;
}

Answer 4

忘れないで-webkit-user-select: none;