Gecko abimé ?

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !

Modérateur : Asumbaa

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Gecko abimé ?

Message par hillrunner » 13 nov. 2003, 22:55

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é :

Image

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é ? :shock:
Olivier

olab
Varan
Messages : 1254
Enregistré le : 30 juil. 2003, 20:20

Message par olab » 13 nov. 2003, 23:27

Oui ya comme qui dirait un pb, sur mon FBird 0.7fr l'affichage correspond à l'attente

fredchat
Lézard à collerette
Messages : 286
Enregistré le : 15 juil. 2003, 18:04

Message par fredchat » 13 nov. 2003, 23:42

moz1.4.1-fr, linux,.

Aucun problème de mon côté.
Benjamin Bayart (FDN) : « L'imprimerie a permis au peuple de lire, Internet va lui permettre d'écrire. »
Adhérez à l'April !

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Message par hillrunner » 14 nov. 2003, 00:42

Il n'y a rien à faire pour réparer ça ?

Un petit patch à télécharger ? :?

Olivier

chBok
Iguane
Messages : 990
Enregistré le : 17 oct. 2003, 19:17

Message par chBok » 14 nov. 2003, 11:23

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...)

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Message par hillrunner » 14 nov. 2003, 11:40

Non, je ne pense pas que ça vienne de l'attribut clear: both, parce que l'exemple précédent, qui l'utilise aussi (mais à l'intérieur d'une <div>) apparaît correctement :?

Olivier

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Message par hillrunner » 14 nov. 2003, 14:05

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 :shock:

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&eacute;e d'un contenu plus long
</p>
<p class="verte">
  Une boite verte
  <hr />
</p>
</body>
</html>
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... :idea:
Olivier

Avatar du membre
bambi
Iguane
Messages : 578
Enregistré le : 17 sept. 2003, 12:29

Message par bambi » 15 nov. 2003, 00:39

Pour moi, la boite verte va dans une div.
Ce qui donne ça:
<!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&eacute;e d'un contenu
plus long
</p>
Une boite verte
<hr>
</div>
</body>
</html>
Par contre le float left n'est pas indispensable pour mozilla et firebird :D 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 :?
Maintenant si quelqu'un à la solution pour que le texte soit à gauche dans IE5, je serais curieuse de la connaitre :wink:

Avatar du membre
bambi
Iguane
Messages : 578
Enregistré le : 17 sept. 2003, 12:29

Message par bambi » 15 nov. 2003, 01:50

bambi a écrit :
Maintenant si quelqu'un à la solution pour que le texte soit à gauche dans IE5, je serais curieuse de la connaitre :wink:
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.

HTML <p class="text">Une boite verte </p>
CCS .text {text-align: left; margin: 0;}

Et ça marche :lol:

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Message par hillrunner » 15 nov. 2003, 11:55

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

Avatar du membre
bambi
Iguane
Messages : 578
Enregistré le : 17 sept. 2003, 12:29

Message par bambi » 15 nov. 2003, 12:05

Bonjour Hillrunner.
Je ne pense pas que le moteur Gecko soit en cause puisque ça ne marche pas non plus avec IE.
Il faudrait demander au rédacteur d'OpenWeb :wink:

hillrunner
Salamandre
Messages : 22
Enregistré le : 12 nov. 2003, 22:40

Message par hillrunner » 15 nov. 2003, 12:10

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

LezeuS
Lézard vert
Messages : 158
Enregistré le : 29 juil. 2003, 19:00

Message par LezeuS » 15 nov. 2003, 12:19

Quand on regarde l'exemple donné, le code source du "résultat" n'est pas le code source donné :
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>
voila celui du résultat

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>
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 ;)
Modifié en dernier par LezeuS le 15 nov. 2003, 12:33, modifié 2 fois.

Avatar du membre
bambi
Iguane
Messages : 578
Enregistré le : 17 sept. 2003, 12:29

Message par bambi » 15 nov. 2003, 12:28

Oui Lezeus :lol:
Je débute en CSS mais de toute façon, je ne vois pas comment ça pourrait fonctionner sans div.
Ce serait donc une erreur d'Open Web !! Tu peux être rassuré hillrunner.
En même temps, ça fait travailler les méninges :lol:

LezeuS
Lézard vert
Messages : 158
Enregistré le : 29 juil. 2003, 19:00

Message par LezeuS » 15 nov. 2003, 12:32

N'est-ce pas :)

Je débute aussi :lol:
C'est le rendez-vous.
Mais faut bien s'entraider ou on arrivera à rien. L'union fait la force :!:

Répondre

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 1 invité