28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un fichier Xhtml + RDFa Ma page avec ce doctype :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


Sur tous les navigateurs excepté IE (IE8 pour moi), 2 feuilles de style sur 3 sont ignorées. J'ai passé le code XHTML et CSS au validateur et c'est ok. J'ai essayé aussi :

<!--[if gte IE 6]><link type="text/css" rel="stylesheet" href="styles/creation_site.css" media="all" /><![endif]-->
<!--[if lte IE 7]><style type="text/css">#global { zoom: 1; }</style><![endif]-->


et :

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />


Mais rien n'y fait.
Modifié par deca05 (09 Jan 2013 - 14:43)
Bonjour,

pourrait-on voir tous les appels aux css ?

D'après ce que tu nous montres par exemple, ton creation_site_css.css ne sera chargé que par IE6, 7, 8 et 9. Aucun autre navigateur ne la chargera puisque seul IE inférieur à 10 comprend les commentaires conditionnels.

SI jamais c'est bien la source du problème, l'article sur alsa sur les commentaires conditionnels pour IE est très complet Smiley cligne

Bon courage !
<link rel="stylesheet" href="styles/prettify.css" type="text/css"/>
<meta name="viewport" content="width=device-width"/>
<link media="screen and (max-width: 300px)" rel="stylesheet" href="styles/mobile.css" type="text/css"/>
<link media="screen and (min-width: 300px)" rel="stylesheet" href="styles/barousel.css" type="text/css"/>
<link media="screen and (min-width: 300px) and (max-width: 640px)" rel="stylesheet" href="styles/tablette.css" type="text/css"/>
<link media="screen and (min-width: 640px)" rel="stylesheet" href="styles/creation_site.css" type="text/css"/>
<!--[if gte IE 6]><link type="text/css" rel="stylesheet" href="http://pierrez.net/styles/creation_site.css" media="all" /><![endif]-->
<!--[if lte IE 7]><style type="text/css">#global { zoom: 1; }</style><![endif]-->


J'avais appelé une deuxième fois creation_site.css pensant que IE n'aimait peut-être pas le media screen an min-width mais avec ou sans l'appel à la CSS conditionnelle, c'est pareil.
Je vois.

D'après tes instructions, un navigateur sur un écran "normal" devrait charger prettify.css, barousel.css, et creation_site.css.

Un de ces trois fichiers n'est pas chargé ?

Si tu penses que l'instruction media peut être fautive, essaie avec la valeur "all" afin de vérifier que tous tes fichiers sont bien chargés.
a écrit :
Un de ces trois fichiers n'est pas chargé ?

Seule la première était chargée.

J'ai résolu mon problème ; c'est bien l'appel à la CSS avec un paramètre de taille en pixel qui pose problème à IE8. En attendant de trouver une solution pour IE, j'ai reporté ce contrôle directement dans la feuille de style. Il ignore les CSS alternatives mais au moins, il affiche quelque chose de correct avec un écran standard.

@media screen and (max-width: 300px) {}


merci Ten, cet échange m'a permis d'avancer.
Modifié par deca05 (09 Jan 2013 - 14:44)