28172 sujets

CSS et mise en forme, CSS3

Bonjour à toutes et à tous,
J'ai un souci de CSS que je n'arrive pas à comprendre sur un site, qui est en construction :
http://85.236.158.52/~inhejiqe/
Réalisé avec Joomla et un template que j'ai essayé de customiser.
Sur la page d'accueil, à droite, il y a un encart intitulé : "ODPC MTE SANTE CONSEIL"
Sur Firefox et sur Chrome, il a bien la couleur jaune que je voudrais lui assigner.
Le problème, c'est que sur Internet Explorer, il est noir.

Quand j'inspecte les feuilles CSS avec le debogueur de FF, je vois bien qu'il y a un style qui dit :
[background-color: #1a1a1a;] et que ma modif prend le pas dessus dans FF.

Malheureusement, ce n'est pas le cas dans IE.
J'aimerai bien pouvoir ajouter quelque chose dans ma feuille de style qui ferait que ma modif marche dans tous les navigateurs, mais je ne vois pas comment....

La réponse serait bien sûr de se débarrasser de IE, mais malheureusement la personne qui m'a demandé le site l'utilise encore....

Quelqu'un aurait une piste s'iouplait ?
Je mettrais bien d'autres infos pour vous aider, mais je ne vois pas quoi. N'hésitez pas si il faut que je précise qq chose !
Merci !
kiikanla a écrit :
Bonjour à toutes et à tous,
J'ai un souci de CSS que je n'arrive pas à comprendre sur un site, qui est en construction :
http://85.236.158.52/~inhejiqe/
Réalisé avec Joomla et un template que j'ai essayé de customiser.
Sur la page d'accueil, à droite, il y a un encart intitulé : "ODPC MTE SANTE CONSEIL"
Sur Firefox et sur Chrome, il a bien la couleur jaune que je voudrais lui assigner.
Le problème, c'est que sur Internet Explorer, il est noir.
Quand j'inspecte les feuilles CSS avec le debogueur de FF, je vois bien qu'il y a un style qui dit :
[background-color: #1a1a1a;] et que ma modif prend le pas dessus dans FF.
Malheureusement, ce n'est pas le cas dans IE.
J'aimerai bien pouvoir ajouter quelque chose dans ma feuille de style qui ferait que ma modif marche dans tous les navigateurs, mais je ne vois pas comment....
La réponse serait bien sûr de se débarrasser de IE, mais malheureusement la personne qui m'a demandé le site l'utilise encore....
Quelqu'un aurait une piste s'iouplait ?
Je mettrais bien d'autres infos pour vous aider, mais je ne vois pas quoi. N'hésitez pas si il faut que je précise qq chose !
Merci !

En affichant le contenu de la console dans les outils Firefox, on constate un nombre très important d'erreurs d'analyse, notamment CSS.
Notamment sur l'attribut background-color :
Une fin de valeur était attendue, mais « \9  » a été trouvé.  Erreur d'analyse de la valeur pour « background-color ».  Déclaration abandonnée. bootstrap.css:1:35092

Un petit coup d'oeil en profondeur sur les erreurs de syntaxe peut être utile.
Modifié par sepecat (17 May 2016 - 23:23)
Merci pour vos réponses.
Malheureusement, je n'arrive pas à savoir par quel bout le prendre.
Je ne suis pas super à l'aise avec la console. J'ai repéré ce /9 dedans, mais pas encore dans le template du site...
je vais suivre votre piste.

Nom de d'là, j'ai fait ce boulot pendant 15 ans, fait une pause pendant 2 ans et je suis complètement largué, désolé.
Promis après j'arrête !
Bon, ne cherchez plus :

Tout à l'heure je suis intervenu à partir de mon téléphone mobile. Maintenant que je suis rentré chez moi et que j'ai regardé le code source j'ai vu ceci :
/* rt_oculus-custom.css, ligne 53 */
.box3 {
    /* du code... */
    background-image: linear-gradient(#ed9f00, #ed8417/*#ed9f00, #ed8417 50%, #ed9f00*/);
    /* encore du code... */
}

De deux choses l'une :
1/ la valeur linear-gradient n'est pas supportée par IE avant la version 11 (selon caniuse), ou tout au moins pas avant la version 10 (selon MDN).
2/ De plus il y a du code commenté au sein de la valeur elle-même, je ne suis pas sûr que tous les navigateurs apprécient.

Voilà voilà...
Merci beaucoup Olivier C.
Il semble bien que tu aies pointé le bon problème.
Ceci dit, j'ai essayé de supprimer la ligne que tu as citée et j'ai eu pour résultat que je n'avais plus de jaune nulle part, ni sur FF, ni sur IE !
Du coup, j'ai triché, j'ai créé un png jaune que j'ai mis comme background-image.

Résultat, c'est jaune partout, j'ai une bande rose non encore identifiée qui est apparue, mais ce n'est pas vilain. Il n'y a plus qu'à espérer qu'elle soit du goût de la personne à qui appartient le site Smiley cligne

Merci pour ton aide aussi Sepecat.

Bonne continuation.