Page 1 sur 1
Pb CSS
Publié : 21 août 2003, 11:33
par O.rey
Bonjour,
Je suis en train de construire une page avec CSS, et trés bizarrement, tout marche quand je teste avec IE (6) mais pas avec Mozille (VF 1.3.1) !!!
Pour résumer, dans la feuille de style j'ai mis un sélecteur .menu (en plus des formats généraux pour tout le site) , et dans la page HTML quand je passe un <P class="menu"> IE prend les formats décrits dans la CSS mais pas Mozilla, qui ne prend que les formats généraux.
Bizarre, non ?
Publié : 21 août 2003, 11:44
par Lemm
A ta place j'aurai plutôt utilisé ceci comme syntaxe :
Comme c'est conseillé
ici
Publié : 21 août 2003, 11:50
par Benoit
Et moi à ta place j'aurais posté dans Développement web

J'ai déplacé le sujet.
Je ne suis pas d'accord pour l'ajout d'un span dans ce cas-ci, je verrais plutôt un div autour (un menu est un bloc en général).
Mais ça n'explique pas pourquoi ton style ne fonctionne pas, vérifie que tu n'as aucun message d'erreur dans la console JavaScript (comme par exemple un mauvais type MIME pour le fichier CSS) et de préférence donne-nous le code source complet ou un lien vers la page, sinon c'est difficile de deviner ce qui ne va pas.
Publié : 21 août 2003, 12:11
par Invité
Benoit a écrit :
Je ne suis pas d'accord pour l'ajout d'un span dans ce cas-ci, je verrais plutôt un div autour (un menu est un bloc en général).
Mais ça n'explique pas pourquoi ton style ne fonctionne pas, vérifie que tu n'as aucun message d'erreur dans la console JavaScript (comme par exemple un mauvais type MIME pour le fichier CSS) et de préférence donne-nous le code source complet ou un lien vers la page, sinon c'est difficile de deviner ce qui ne va pas.
Je vais venir au DIV, mais là, j'en profitais pour ré-apprendre le CSS pas à pas (en suivant les exemples openweb) .
Le fichier CSS donne cela :
BODY {color: #5B5B5B ;
font-family : "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
} ;
.menu { margin-left: 15% ; margin-right: 15% ;
font-weight: bolder } ;
et la page HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>
<head>
<title>Sans Titre</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 2.6">
<LINK rel="stylesheet" href="vienne.css" type="text/css">
</head>
<body bgcolor="#FFFFFF">
<p class=menu>
Vivre Vienne </p>
</body>
</html>
Publié : 21 août 2003, 12:55
par Bobe
Lemm a écrit :A ta place j'aurai plutôt utilisé ceci comme syntaxe :
Comme c'est conseillé
ici
On doit pas lire la même chose.. où est ce conseillé ?
Publié : 21 août 2003, 13:21
par Lemm
Anonymous a écrit :Le fichier CSS donne cela

...)
Essayes comme ça (je sais pas pourquoi ça marche pas dans l'autre sens) :
Code : Tout sélectionner
.menu {
font-weight: bolder;
margin-left: 15% ;
margin-right: 15% ;
} ;
body {color: #5B5B5B ;
font-family : "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
} ;
et
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Sans Titre</title>
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 2.6">
<link href="viennes.css" rel="stylesheet" type="text/css">
</head>
<body>
<p class="menu">
Vivre Vienne</p>
</body>
</html>
PS: Merci Bobe d'avoir trouver une super solution au problème... tss tss tss
Publié : 21 août 2003, 13:57
par Invité
Essayes comme ça (je sais pas pourquoi ça marche pas dans l'autre sens) :
Code : Tout sélectionner
.menu {
font-weight: bolder;
margin-left: 15% ;
margin-right: 15% ;
} ;
body {color: #5B5B5B ;
font-family : "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
} ;
et
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Sans Titre</title>
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 2.6">
<link href="viennes.css" rel="stylesheet" type="text/css">
</head>
<body>
<p class="menu">
Vivre Vienne</p>
</body>
</html>
PS: Merci Bobe d'avoir trouver une super solution au problème... tss tss tss[/quote]
Merci de l'effort. Cela fonctionne mais partiellement : les spécifications du Body sont ignorées (du moins la couleur à premier vue).
Tout se passe comme si Mozilla ne prenait que le premier sélecteur en ignorant les autres.
En tout cas, c'est embêtant conceptutellement, même si pratiquement, on peut s'en tirer en faisant plusieurs fichiers CSS.
Je suis néophyte en la matière, mais il faudrait qu'un pro identifie le problème quand même, car cela fait tâche que Mozilla soit moins cool qu'IE avec les spécifications CSS ...
Publié : 21 août 2003, 14:14
par olab
Anonymous a écrit :
Merci de l'effort. Cela fonctionne mais partiellement : les spécifications du Body sont ignorées (du moins la couleur à premier vue).
Tout se passe comme si Mozilla ne prenait que le premier sélecteur en ignorant les autres.
En tout cas, c'est embêtant conceptutellement, même si pratiquement, on peut s'en tirer en faisant plusieurs fichiers CSS.
Je suis néophyte en la matière, mais il faudrait qu'un pro identifie le problème quand même, car cela fait tâche que Mozilla soit moins cool qu'IE avec les spécifications CSS ...
Hello,
je viens de tester avec ça (pareil que le code qu'on t'a donné) :
Code : Tout sélectionner
.menu {
font-weight: bolder;
margin-left: 15%;
margin-right: 15%;
}
body {
color:#5B5B5B;
font-family : "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
}
Sous moz1.5a et Fb0.6.1+ et ça marche (tout)
Par contre regarde bien, tu fais un <link href="viennes.css" rel="stylesheet" type="text/css">
Vérifie que c'est pas vienne.css et pas viennes.css ...
Olivier
Publié : 21 août 2003, 14:21
par Lemm
Anonymous a écrit :Merci de l'effort. Cela fonctionne mais partiellement : les spécifications du Body sont ignorées (du moins la couleur à premier vue).
Tout se passe comme si Mozilla ne prenait que le premier sélecteur en ignorant les autres.
En tout cas, c'est embêtant conceptutellement, même si pratiquement, on peut s'en tirer en faisant plusieurs fichiers CSS.
Je suis néophyte en la matière, mais il faudrait qu'un pro identifie le problème quand même, car cela fait tâche que Mozilla soit moins cool qu'IE avec les spécifications CSS ...
Voilà, il semble qu'il soit obligatoire de spécifier background-color: quand on met color: et l'inverse aussi!
Code : Tout sélectionner
.menu {
font-weight: bolder;
margin-left: 15%;
margin-right: 15%;
}
body {
background-color: #ffffff;
color: #5B5B5B;
font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
}
Et ça marche

Publié : 21 août 2003, 14:44
par Bobe
Lemm a écrit :
PS: Merci Bobe d'avoir trouver une super solution au problème... tss tss tss
quoi ? tu dis quelque chose de faux, il me semble normal de pointer du doigt l'erreur.
Pour le css qui foirait, je viens de m'en rendre compte, ça vient des ; qui suivaient les fermetures d'accolades (alors qu'il ne devrait pas y en avoir) ce qui a dù occasionner ces comportements étranges
.menu {
font-weight: bolder;
margin-left: 15% ;
margin-right: 15% ;
} ;
body {color: #5B5B5B ;
font-family : "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
} ;
lemm a écrit :
Voilà, il semble qu'il soit obligatoire de spécifier background-color: quand on met color: et l'inverse aussi!
pas obligatoire, mais conseillé
Publié : 21 août 2003, 15:01
par Invité
Pour le css qui foirait, je viens de m'en rendre compte, ça vient des ; qui suivaient les fermetures d'accolades (alors qu'il ne devrait pas y en avoir) ce qui a dù occasionner ces comportements étranges
Ouiiiii !
Voilà la solution qui marche !
Et vous savez pourquoi je mettais ces points-virgules ?
Une raison bête : à force d'écrire du PHP.
Une raison plus gênante : par assimiliation auxexemples présentées par Laurent Denis sur Open Web
http://openweb.eu.org/articles/initiation_css/ ....

Publié : 21 août 2003, 15:17
par Benoit
Tu pourrais peut-être écrire à l'auteur pour signaler la confusion possible.
Quoique j'ai écrit il y a plus d'un mois à l'auteur de XHTML en une heure pour lui signaler que ses exemples sur l'utilisation de l'attribut alt étaient un peu douteux et que ça a toujours pas été fait

Publié : 21 août 2003, 18:51
par fredchat
Bobe a écrit :ce qui a dù occasionner ces comportements étranges
Comportement standard de Mozilla, comportement bogué (qui a dit normal ?) de ie.
Publié : 21 août 2003, 23:42
par Bobe
Anonymous a écrit :
Une raison bête : à force d'écrire du PHP.
même en php, y a pas de point virgule après une accolade
Comportement standard de Mozilla, comportement bogué (qui a dit normal ?) de ie.
oui, je suis d'accord. Ma phrase signifiait plutot "résultat différent du résultat attendu"