CSSとIE8：IE8のサブミット入力時に一貫して機能するCSSのカラープロパティを取得するにはどうすればよいですか？

背景を濃い青色にし、フォントの色を白にするCSSルールが適用された入力type='submit'を使用しています。私はこの入力をIE 8で一貫してレンダリングすることはできません。私のサイトのいくつかの部分では、その美しい白いタイプでうまく見えます。他の部分では、ボディに割り当てられた色は、CSSルールによって適用された白よりも優先されます。CSSとIE8：IE8のサブミット入力時に一貫して機能するCSSのカラープロパティを取得するにはどうすればよいですか？

私はこれについてかなりの研究をしており、うまくいくソリューションを見つけることができません。私がCSS Tricksで見つけたのは、jQueryを使ってCSSを追加することをお勧めしました。私はこれを試した。私は首尾よくインラインスタイルを追加しましたが、IE8はまだ白を駄目にしました。 Compatibility Viewを入れ替えましたが、ダイスはまだありません。 0

なぜですか？

ここには適切なマークアップとCSSがあります。

CSS

body { 
    color:#222; 
    font-size: 12px; 
    width:100%; 
    background:#8A7967 url(images/bg_body.png) top left repeat-x; 
} 

.buttonBigBlue, 
input[type="submit"] { 
    color:#FFF!important; 
    -webkit-border-radius:12px; 
    -moz-border-radius: 12px; 
    border-radius:12px; 
    padding:3px 9px; 
    text-transform:uppercase; 
    font-weight:bold; 
    text-align:center; 
    vertical-align:middle; 
    border:1px solid #74a1a9; 
    cursor:pointer; 
    background: #678382; /* for non-css3 browsers */ 
    background:-webkit-gradient(linear, left top, left bottom, from(#77A7B1), to(#678382)); 
    background:-moz-linear-gradient(top, #77A7B1, #678382); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#77A7B1', EndColorStr='#678382'); /* IE6,IE7 */ 
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#77A7B1', EndColorStr='#678382')"; /* IE8 */ 
}

MARKUP

<input type="submit" class="buttonBigBlue" id="login" value="Login" name="login">

IE8で＃222テキストとこのボタンが表示されます。 IE8

で#FFFテキストさらなる調査の後にUPDATEと

<input type="submit" class="buttonBigBlue" id="saveChanges" value="Save Changes" name="saveChanges">

このボタンが表示されます。

入力が正しく表示されないdivは、#loginBoxと呼ばれます。

 
#loginBox { 
    width:300px; 
    margin:25px auto; 
    padding: 25px 30px 30px; 
    border:1px solid #c9b9a8; 
    -webkit-border-radius:9px; 
    -moz-border-radius: 9px; 
    border-radius:9px 9px 9px 9px; 
    -webkit-box-shadow:rgba(0,0,0,.3) 4px 4px 6px; 
    -moz-box-shadow: 4px 4px 6px rgba(0,0,0,.3); 
    /* For IE 8*/ 
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color='#544845')"; 
    /* For IE 5.5 - 7*/ 
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color='#544845'); 
    min-height:160px; 
    background-color:#fff; 
    box-shadow: 4px 4px 6px rgba(0,0,0,.3); 
}

ボックスシャドウを設定する-ms-filterとフィルタルールを削除すると、入力テキストは白に戻ります。

出典

2010-12-14 JanetT

[type = "submit"]の高度なセレクタはIE8でサポートされている場合とサポートされていない場合があります。実際、それはcss3セレクタなので、IEの互換性は不十分かもしれません。ちょっとした考え。 – Qix

bgイメージや 'type =" image "'を使ったと思ったことはありますか？ –

@ Di-0xide：IEはこれを完全にサポートしています。 – mingos