Discussion :

[lison1]

Bonjour,

Je suis en train de "programmer" un site pour héberger mon blog.
J'ai choisi d'utiliser spip afin d'avoir rapidement un site dynamique.

(j'espère avoir placé mon message dans la bonne rubrique parce que je pense que le problème vient du css, mais je n'en suis pas sure)

Tout va bien sous Firefox, mais en testant avec IE, le menu n'est pas du tout placé au bon endroit !

De plus il y a une balise de fermeture de commentaire HTML qui se balade en haut du menu. Pourtant j'ai tout vérifié dans mon code et il n'apparait pas sous firefox.

J'ai également testé sous opera, et là, le menu est correct à l'exception de la balise de commentaire.

pour voir en vrai : par ici

Quelqu'un a t'il une idée de où ça peut venir?

merci de votre aide

[Er3van]

Si ça vient du/des css peut-être que nous le montrer serait une bonne idée non ? ^^

Si le problème vient d'IE uniquement, plusieurs questions :

IE ou IE 6 seulement ? Parcequ'avec mon IE7 no soucy. ( J'ai pas le 6 en ce moment ).

Est-ce que tu utilises des div en "float" ?
Attention au bug des trois pixels, prévoir 3px par div flottant dans ta largeur de page.

Est-ce que tu utilises des margin ou des padding ?
IE ne les interprete pas tout a fait pareil, source d'erreur.

Pour ce qui est de ta balise flottante, elle n'apparait pas sous IE7, mais c'est peut-etre une balise qu'on oublie en fin de page, après un ?> d'un script PHP par exemple, à voir.

[lison1]

merci pour ta réponse et désolée pour le temps que j'ai mis à répondre...

c'est bizarre que tu ne vois pas la balise parce qu'il me semble bien que c'est la version 7 d'IE que j'ai.

ça marche correctement sous Firefox, mais pas sous IE ni opera.

récapitulatif :
sous Firefox : tout est OK

sous IE : toutes les images composant le menu sont en ba de la page (au lieu de sur le coté) et il y a une balise de fin de commentaire qui s'affiche en haut du menu.

sous opera : le menu est à sa place, mais il y a une balise de fin de commentaire qui s'affiche en haut du menu et la partie sous le menu n'est pas rose comme le contenu de la page (alors qu'elle devrait)

pour le code CSS, c'est compliqué parce que c'est assez long. Mais je copie ici la partie sur le menu de navigation car je pense que c'est cette partie qui pose problème.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
/*  ------------------------------------------
/*  Disposition a l'ecran des blocs principaux
/*  ------------------------------------------ */
#page 
{
    background:#FEDBF1;
    width: 800px;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}
 
#conteneur { width: 100%; }
 
#conteneur #contenu 
{
    background: #FEDBF1;
    float: right;
    width: 550px;
}
 
#conteneur #navigation 
{
    display:block;
    background: #FEDBF1;
    margin: 0px 0px 0px 0px;
    /*background-image: url(<a href="http://lettreaelise.idoo.com/IMG/pied_base1.jpg%29;*/" target="_blank">http://lettreaelise.idoo.com/IMG/pied_base1.jpg);*/</a>
    /*background-repeat:no-repeat;*/
    /*float: right;*/
    width: 250px;
    /*height: 205px;*/
    text-align: center;
}
 
/*blocs de navigation*/
#navigation .zone1 { 
margin: 0px 0px 0px 0px;
float: left; 
width : 250px;
height: 205px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/courrier.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/courrier.jpg);</a>
}
#navigation .zone2 { /* zone cliquable */
float: left; /*permet de donner une dimension à la balise a qui est une balise en ligne */
width : 250px;
height: 154px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/Elise.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/Elise.jpg);</a>
}
#navigation .zone3 { /* zone cliquable */
float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
width : 250px;
height: 154px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/Liens.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/Liens.jpg);</a>
}
#navigation .zone4 { /* zone cliquable */
float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
width : 250px;
height: 154px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/Rss.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/Rss.jpg);</a>
}
#navigation .zone5 { /* zone cliquable */
float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
width : 250px;
height: 205px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/piedlapin.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/piedlapin.jpg);</a>
}
#navigation .zone6 { /* zone cliquable */
float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
width : 250px;
height: 154px;
background-image: url(<a href="http://lettreaelise.idoo.com/IMG/book.jpg%29;" target="_blank">http://lettreaelise.idoo.com/IMG/book.jpg);</a>
}
 
/* Blocs du contenu (c-a-d. la colonne principale) */
#contenu .contre-encart {
    float: left;
    width: 21em;
}

Je ne suis pas très forte en CSS alors je ne suis pas sure d'avoir compris ce qui risque d'être source de l'erreur...
c'est possible qu'il y ai un pb avec les margins ou les paddings que je ne comprends pas complètement.


merci beaucoup de votre aide !!!

[kaiser59]

Salut,

En cherchant 5min dans ton code j'ai trouvé ça :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
			</div><!-- fin contre-encart --
			<!-- /fragment_html_1c4f894574d730e016e980d91fa678ca_articles --></div>-->

T'as plus cas corrigé cette erreur. Tu as essayé de faire de l'imbrication de commentaires ?


De plus, je ne sais pas si c'est SPIP qui génère le code mais c'est vraiment la cata dedans. Apprend à coder par toi même pour mieux comprendre ce que tu fais et avoir un meilleur contrôle surtout des éléments que tu vas placer.
Enfin, valide ton code W3C et vire tous ces commentaires qui pollut ton code qui n'est déjà pas très propres malheureusement.

[lison1]

merci je vais essayer de corriger ça.

oui en effet, c'est spip qui génère le code car justement le code est très propre car décomposé en plein de fichiers.
mais le code qu'on peut afficher dans le navigateur est le code résultent généré par spip, c'est pour ça que c'est le bazar.

je vais donc essayer de retrouver cette erreur dans le bon fichier spip.

merci pour ton aide !

[lison1]

j'ai enfin résolu le problème !!!

merci beaucoup !!

[mariemoz]

Merci d'avoir résolu le problème, mais serait-il possible d'avoir la solution?

J'ai exactement le même souci avec IE 7

merci

j'ai enfin résolu le problème !!!

merci beaucoup !!