Linear-gradient funktioniert nicht im IE 11

Habe ich eine css-Regel, die funktioniert gut in chrome, firefox und verwendet, um im IE funktioniert. Nun meine scheinbar valid css nicht funktioniert.

.s-tour {
/*border-radius: 5px;*/
margin: 0 auto;
width: 250px;
height: 200px;
line-height: 100px;
font-weight: 600;
font-size: 18px;
box-shadow: 0 0 7px rgba(1, 1, 1, .8);
border: solid thin #555;
color: #E0E0E0;
background: #555;
background-image: linear-gradient(to bottom, #555 0%, #eee 100%);
background-image:-webkit-linear-gradient(top, #777, #666);
background-image: -ms-linear-gradient(top,#555555 0%,#666666 100%);
background-image:-o-linear-gradient(top, #777, #666);
background-image:-moz-linear-gradient(top, #777, #666);
}

Ich fühle mich wie beide background-image: linear-gradient(to bottom, #555 0%, #eee 100%); oder -ms-background-image: linear-gradient(top,#555555 0%,#666666 100%); arbeiten, sollten für den IE 11 noch die der IE-inspector stellt eine fuzzy roten Linie unter ihm, und etwas anderes, das ich versuchen.

Ich überprüfte eine Arbeitsgruppe Farbverlauf auf einer google-Seite und background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1); war in Ordnung arbeiten, aber auch, dass exakte Linie würde nicht funktionieren auf meiner Seite.

Ich habe versucht, alle Variationen die ich mir vorstellen kann in Bezug auf Immobilien -, Präfix-und-Werte, einschließlich aller relevanten Antwort auf stack overflow und bin jetzt ratlos, Frage mich, ob es ist ein DOM-Problem oder bug oder etwas einfaches.

Sie können dieser Seite zu generieren css gradient

InformationsquelleAutor bruce | 2014-10-23

  1. 7

    versuchen, das hinzufügen dieser Zeile an das Ende der Klasse:

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#555555, endColorstr=#666666);
    Dieser funktioniert. Im überrascht, ich dachte, das war IE vor 10 syntax
    Ich war nur in der Lage, um es arbeiten nach umgebenden Farben in einfache Anführungszeichen wie " filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#666666');` +1
    WOW!!! Das funktionierte, danke @xzegga!

    InformationsquelleAutor xzegga

  2. 8

    Also das problem, das ich wirklich hatte, war, dass ich nicht sagen IE zum Rendern der Seite mit den neuesten standards von css.
    Hinzufügen <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> zu den <head> block behoben die meisten meiner Probleme.

    InformationsquelleAutor bruce

  3. 3

    Was für mich gearbeitet hat im IE11 ist die richtige Anwendung der CSS3 linear-gradient Eigenschaft (http://www.w3schools.com/css/css3_gradients.asp)

    Beispiel:

    background: linear-gradient(to bottom, #FFF 0%, #EEE 100%);

    Nach, dass ich nicht brauchen, um verwenden Sie keine meta-tags oder alt-filter-syntax.

    InformationsquelleAutor eMike Wallace

Schreibe einen Kommentar