vue Problème d'affichage CSS3 sous IE9
Kommunauty
Connexion
Inscription

Forum Programmation Problème d'affichage CSS3 sous IE9

Problème d'affichage CSS3 sous IE9


Warranty Messages : 389

Bonjour à tous,

Je suis en train de faire quelques modification dans le CMS PluXML avec du CSS3, mais je rencontre un petit problème sous IE9, actuellement je suis en train de modifier la page Erreur.php, mais sous IE9 le fond "background" de s'affiche pas. Par contre sous Firefox aucun problème.

Exemple (carrée rouge) : http://www.xedec.fr/static0/a-propos <= a ouvrir sous IE bien-sur

Mon code CSS

.border_rounded 
{
	background: -moz-linear-gradient(#D55151, #BD4848) repeat transparent;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	box-shadow: 0px 0px 3px #434343;
    border: 1px solid #A33636;
    padding: 20px;
    width: 500px;
	color:#FFFFFF;
	font-size:13px;
	font-weight:bold;
	float:left;
	text-align:center;
	text-shadow: 0px 1px #333333;
	text-transform: uppercase;
        margin:20px 0px 20px 60px;
}

Cordialement, Warranty

dimanche 1 mai 2011 (Dernière édition dimanche 1 mai 2011)

Arthic Messages : 32

Ie9 est compatible css3, tout comme firefox 4 et chrome

Donc t'as juste a rajouté une ligne linear-gradient avec les mêmes arguments, et les 3 navigateurs ci dessus la liront parfaitement

Pareil pour border radius et tous les autres fonctionnalitées fonctionnalités supplémentaires de css3
dimanche 1 mai 2011

Arthic Messages : 32

Oups, j'ai dit une connerie, je corriges : 

.border_rounded 
{
    background: -moz-linear-gradient(#D55151, #BD4848) repeat transparent;
    background: -linear-gradient(#D55151, #BD4848) repeat transparent; /* pour ie9 */
    background: -webkit-linear-gradient(#D55151, #BD4848) repeat transparent; /* pour chrome et tous les navigateurs utilisant le moteur webkit */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -border-radius: 5px;
    box-shadow: 0px 0px 3px #434343;
    border: 1px solid #A33636;
    padding: 20px;
    width: 500px;
    color:#FFFFFF;
    font-size:13px;
    font-weight:bold;
    float:left;
    text-align:center;
    text-shadow: 0px 1px #333333;
    text-transform: uppercase;
    margin:20px 0px 20px 60px;
}
dimanche 1 mai 2011

Warranty Messages : 389

Merci pour ton aide

Aucun problème sous Firefox, ni sous Chrome, mais sous IE9 le fond de s'affiche toujours pas

dimanche 1 mai 2011

Arthic Messages : 32

Ah oui je viens de voir qu'il y avait un fond (il n'y était pas sous chrome non plus avant ')

Alors là j'arrive pas a cerner le problème =/

P'tét que ça vient d'IE9 x)
dimanche 1 mai 2011

Courroux Messages : 2215

Etonnant de la part d'IE9 quand même, à croire que quoi qu'il fasse, ça restera pourrie chez eux...

Voici un lien qui devrait t'aider: Clique ici.
dimanche 1 mai 2011

Arthic Messages : 32

En effet ça vient d'ie, il faut que t'utilises -ms-filter : blablabla que je connais pas

ou bien t'apprends a te servir des SVG
dimanche 1 mai 2011

Warranty Messages : 389

Problème résolu, j'ai utilisé le site http://www.display-inline.fr/projects/css-gradient/ et tout fonctionne comme il faut (Firefox, Internet Explorer, Chrome, Opéra)

Voici le nouveau code CSS:

.border_rounded {
	/* Anciens navigateurs */
	background: #BD4848 url("border_rounded-bg.png") repeat-x top;
	-o-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	/* Internet Explorer */
	*background: #BD4848;
	background: #BD4848
dimanche 1 mai 2011

Répondre Pour répondre, tu dois d'abord t'inscrire rapidement sur Kommunauty. Rejoins-nous vite !

Forum Programmation Problème d'affichage CSS3 sous IE9

Kommunauty © Tous droits réservés Contact / Charte & Mentions légales / Hebergement gratuit / Bon plan hébergement / Aide B2i

RSS