Nous avons un site Web qui est essentiellement trois colonnes,chacun avec une couleur différente appliquée via des dégradés linéaires. Bien que cela fonctionne très bien dans Firefox et Chrome, il se casse dans IE8. Par exemple, l’arrière-plan est blanc dans les deux colonnes les plus éloignées. Il semble parfait dans Chrome mais terrible dans IE8.
Le site est ici: http://clubsatcrp.com/walkingchallenge/
Tout le monde pense à une solution à résoudreCe problème, et à tout le moins le fait ressembler de la même manière en ce qui concerne les couleurs de fond de la colonne dans IE8? Je suis parfaitement d'accord pour résoudre le problème, mais comme il s'agit d'un programme d'entreprise et que notre société utilise IE8, il C'est un peu un problème.
Voici la partie du CSS (gradients linéaires):
background: -webkit-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -moz-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -ms-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -o-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#4e9dd1 66.66%,
#4e9dd1
);
Réponses:
0 pour la réponse № 1Si vous avez besoin de 3 colonnes d'égale hauteur, même sur IE8, vous pouvez utiliser display: table; (et *-cell).
Vous pouvez ensuite définir une couleur d’arrière-plan sur chacune d’elles, avec une couleur correspondante pour vous assurer qu’elle est lisible en toutes circonstances (voir WCAG 2.0 F24 spécifier les couleurs de premier plan sans spécifier les couleurs d'arrière-plan ou inversement)
Violon: http://jsfiddle.net/VbGap/
Le rendu sur IE6 et IE7 peut être amélioré avec très peu d’effort, mais il ne sera pas rendu non plus.