Gecko abimé ?
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
Gecko abimé ?
Bonjour à tous,
Je me présente, je suis nouveau sur ce forum. J'étudie XHTML, les CSS, et je découvre depuis la version 1.4 la suite Mozilla.
J'ai un problème curieux que je souhaite vous soumettre parce que je n'y comprend fichtrement rien.
J'étudie depuis quelque temps les cours CSS d'Openweb. Et dans le cours suivant, un exemple ne fonctionne absolument pas sous Moz I.4 à 1.6 :
http://www.openweb.eu.org/articles/initiation_float/
L'exemple précis qui ne fonctionne pas est celui intitulé "Une variante du spacer : <hr />".
En essayant d'exécuter cet exemple avec HTML Kit et Moz, j'arrive au résultat suivant, qui ne correspond pas du tout à ce qui est indiqué :
Je dois indiquer que j'ai installé plusieurs versions de Moz successivement, en revenant parfois à la précédente depuis que j'ai ce problème.
Quelqu'un a une idée ? Il semble que Moz interprète mal certaines règles CSS ! Gecko serait-il abimé ?
Olivier
Je me présente, je suis nouveau sur ce forum. J'étudie XHTML, les CSS, et je découvre depuis la version 1.4 la suite Mozilla.
J'ai un problème curieux que je souhaite vous soumettre parce que je n'y comprend fichtrement rien.
J'étudie depuis quelque temps les cours CSS d'Openweb. Et dans le cours suivant, un exemple ne fonctionne absolument pas sous Moz I.4 à 1.6 :
http://www.openweb.eu.org/articles/initiation_float/
L'exemple précis qui ne fonctionne pas est celui intitulé "Une variante du spacer : <hr />".
En essayant d'exécuter cet exemple avec HTML Kit et Moz, j'arrive au résultat suivant, qui ne correspond pas du tout à ce qui est indiqué :
Je dois indiquer que j'ai installé plusieurs versions de Moz successivement, en revenant parfois à la précédente depuis que j'ai ce problème.
Quelqu'un a une idée ? Il semble que Moz interprète mal certaines règles CSS ! Gecko serait-il abimé ?
Olivier
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
http://www.openweb.eu.org/articles/init ... 1.html#ex5
Avec Mozilla 1.4-fr, j'ai bien le bon résultat.
(sur ton problème, on dirais que le style CSS clear: both n'est pas pris en compte, et du coup le trait <hr> traverse la boite de droite...)
Avec Mozilla 1.4-fr, j'ai bien le bon résultat.
(sur ton problème, on dirais que le style CSS clear: both n'est pas pris en compte, et du coup le trait <hr> traverse la boite de droite...)
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
Je viens de faire le test dans le Mozilla 1.2.1 Macintosh de mon boulot, et l'erreur se reproduit... ça ne viendrait donc peut-être pas de Moz, mais du code, mais je ne vois rien de suspect
Voilà le code :
Je ne comprends toujours pas, ça ne donne absolument pas le résultat montré dans l'exemple d'Openweb.
Si jamais vous trouvez le problème...
Olivier
Voilà le code :
Code : Tout sélectionner
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test Mozilla</title>
<style type="text/css">
<!--
.jaune {
background-color: #ffff00;
float: right;
width: 100px;
margin: 0;
}
.verte {
background-color: #00ff00;
}
hr {
clear: both;
}
-->
</style>
</head>
<body>
<p class="jaune">
Une boite jaune flottant dotée d'un contenu plus long
</p>
<p class="verte">
Une boite verte
<hr />
</p>
</body>
</html>
Si jamais vous trouvez le problème...
Olivier
Pour moi, la boite verte va dans une div.
Ce qui donne ça:
Maintenant si quelqu'un à la solution pour que le texte soit à gauche dans IE5, je serais curieuse de la connaitre
Ce qui donne ça:
Par contre le float left n'est pas indispensable pour mozilla et firebird mais pour IE6. Par contre pour IE5, même avec un float left, il me colle le texte "une boite verte" à droite sur la boite jaune<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test Mozilla</title>
<style type="text/css">
<!--
.jaune {
background-color: #ffff00;
float: right;
width: 100px;
margin: 0;
}
.verte {
background-color: #00ff00;
float: left;
}
hr {
clear: both;
}
-->
</style>
</head>
<body>
<div class="verte">
<p class="jaune">Une boite jaune flottant dotée d'un contenu
plus long
</p>
Une boite verte
<hr>
</div>
</body>
</html>
Maintenant si quelqu'un à la solution pour que le texte soit à gauche dans IE5, je serais curieuse de la connaitre
J'ai trouvé une solution pour que l'affichage soit le même dans les 4 navigateurs (IE6 - Mozilla-FB et IE5) pour le texte dans la boite verte.bambi a écrit :
Maintenant si quelqu'un à la solution pour que le texte soit à gauche dans IE5, je serais curieuse de la connaitre
HTML <p class="text">Une boite verte </p>
CCS .text {text-align: left; margin: 0;}
Et ça marche
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
Merci Bambi, ça fonctionne effectivement dans une <div>
Mais je ne comprends pas pourquoi, tel qu'il est présenté sur le tutoriel d'Openweb, cet exemple n'apparaisse pas correctement chez moi.
C'est ça mon problème, et c'est ce qui m'amène à penser que le moteur gecko est peut-être abimé, et à me demander ce que je pourrais faire pour le rétablir dans son intégrité (à part un format: c bien entendu, je ne me sens pas actuellement d'entreprendre une telle opération...)
Actuellement sur ma machine, j'ai IE6, Moz 1.6a, Firebird 0.7, Netscape 7.1 et Opera 7.21.
L'exemple d'Openweb qui me turlupine ne passe correctement que dans Opera...
Olivier
Mais je ne comprends pas pourquoi, tel qu'il est présenté sur le tutoriel d'Openweb, cet exemple n'apparaisse pas correctement chez moi.
C'est ça mon problème, et c'est ce qui m'amène à penser que le moteur gecko est peut-être abimé, et à me demander ce que je pourrais faire pour le rétablir dans son intégrité (à part un format: c bien entendu, je ne me sens pas actuellement d'entreprendre une telle opération...)
Actuellement sur ma machine, j'ai IE6, Moz 1.6a, Firebird 0.7, Netscape 7.1 et Opera 7.21.
L'exemple d'Openweb qui me turlupine ne passe correctement que dans Opera...
Olivier
-
- Salamandre
- Messages : 22
- Inscription : 12 nov. 2003, 22:40
Oui, mais comment se fait-il que l'exemple apparaisse correctement chez tout le monde SAUF chez moi ?
Je rappelle qu'il s'agit de l'exemple "une variante du spacer : <hr />" du tutoriel :
http://www.openweb.eu.org/articles/initiation_float/
Si tu veux bien, jette un oeil à la capture d'écran que je donne au début du post, tu verras que le background color vert n'englobe que la ligne de texte, et non la totalité de la <p>, ainsi que la ligne <hr />... alors que ce devrait être l'inverse.
Et toutes les personnes à qui j'ai demandé de faire le test ont un bon résultat, qui correspond à celui présenté sur le tutoriel d'Openweb...
Donc il y a bien un problème chez moi, sur ma machine ou dans mon moteur gecko, mais je voudrais bien savoir lequel
Olivier
Je rappelle qu'il s'agit de l'exemple "une variante du spacer : <hr />" du tutoriel :
http://www.openweb.eu.org/articles/initiation_float/
Si tu veux bien, jette un oeil à la capture d'écran que je donne au début du post, tu verras que le background color vert n'englobe que la ligne de texte, et non la totalité de la <p>, ainsi que la ligne <hr />... alors que ce devrait être l'inverse.
Et toutes les personnes à qui j'ai demandé de faire le test ont un bon résultat, qui correspond à celui présenté sur le tutoriel d'Openweb...
Donc il y a bien un problème chez moi, sur ma machine ou dans mon moteur gecko, mais je voudrais bien savoir lequel
Olivier
Quand on regarde l'exemple donné, le code source du "résultat" n'est pas le code source donné :
voici le code donné
voila celui du résultat
Il y a bien une div. Ce qui expliquerait les différences que tu as eu en executant le code donné...
Ton moteur gecko va mieux du coup
voici le code donné
Code : Tout sélectionner
<p class="jaune">Une boîte jaune flottant doté d'un contenu plus long...</p>
<p class="verte">Une boîte verte
<hr>
</p>
Code : Tout sélectionner
<div class="verte5">
<p class="jaune5">Une boîte jaune flottant doté d'un contenu plus long...</p>
<p>Une boîte verte</p>
<hr class="spacer">
</div>
Ton moteur gecko va mieux du coup
Dernière modification par LezeuS le 15 nov. 2003, 12:33, modifié 2 fois.
Qui est en ligne ?
Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 7 invités