font-faceは、Operaブラウザの自動補完ドロップダウンリストを台無しにします。

Question

タイトルで言及したように、CSSフォントファミリ、カスタムフォント（フォントフェイス）を使用すると、黒い背景、黒いテキスト））オペラの自動完了ドロップダウンリスト。

input[type='text'], input[type='password'], input[type='email'], input[placeholder] { 
    font-size: 1.2em; 
    font-family: sans-serif; 
    color: #2A873A; 
    padding-left: 25px; 
} 

上記のコードはうまく機能しますが、「font-family：sans-serif;」と置き換えても問題ありません。いくつかのフォントフェイスフォント（Googleのウェブフォントも）を使用すると、問題が始まります。

「バグ」のスクリーンショットです。

P.S.私はOperaのネイティブなオートコンプリートであり、カスタムjsではなく、ドロップダウンリストであることを言及する必要があります。

EDIT： http://jsfiddle.net/burCR/

Answer 1

は、あなたのCSSに直接フォントを指定したことがありますか？例えば：

div.magicsomething {font-family:CustomFont,Customfont2,sans-serif;} 

は、あなたが上記をしない場合、あなたはまた、非常によくあなたの "ネストされた要素の中に font-family:inheritが必要な場合がありますので、ネストされた要素は、カスタムフォントと動けなくなる点に注意してください。

余分なヘルプについては、あなたのサイトにカスタムフォント、あなたの完全なCSSやライブリンクの名前を言及してください

Answer 2

これは明らかに何かあるかもしれないが、あなたのフォントはオペラと互換性があることを確認してください。ここにいくつかのWebセーフフォントのリストがあります。

http://www.w3schools.com/cssref/css_websafe_fonts.asp

そして、それは、Microsoft Wordからしたいフォントを取ってみて、代わりにWebセーフ1を使用してのカスタムフォントあなたを挿入するために@fontfaceを使用して動作しない場合。

最後に、フォーム上のfont-familyを使用して、入力がフォントを継承するようにしてください。 うまくいけば、これは助けになりました。

Answer 3

フォントを直接指定すること。私の経験では、ブラウザ間の互換性が非常に優れたbase64エンコーディングを試してみてください。

Answer 4

背景とテキストの両方に個別に色を指定できます。

input { 
    background-color: white; 
    color: black; 
    font-family: "My Fontface Font", Verdana, ms serif; 
}