28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Ce matin, j'ai remarqué que sous internet explorer 7 le menu de mon site et me fil d'ariane sont décalés.

Je ne vois pas ce qui pose problème dans mon code ...

Voici une des pages qui pose problème : http://cspj.be/enseignants/informatique/

Qqun aurait-il une idée ?

Merci d'avance pour votre aide,

Sub
Modifié par subran (08 May 2012 - 18:54)
Bonsoir,
Séparer le menu en 2 n'est pas très heureux, d'ailleurs une liste avec un seul li faut éviter également, tu as la place à droite pour le dernier menu.
Attribuer une hauteur fixe à nav n'est pas une très bonne idée.
Ensuite les flottant (float:left) sont sortis du flux normal vis à vis des bloc suivant.
Il faut donc penser à dégager le bloc suivant avec un clear:left.
Merci pour ta réponse.

Quand tu parles d'une liste avec un seul li... de quelle liste parles-tu ?

Je vais essayer de mettre le second menu à droite.

En changant dans NAV le height: 34px; en min-height: 34px;
en suivant ton conseil j'ai aussi changer le height: 171px; en min-height: 171px; pour le header et le tout donne déjà mieux merci !

"Il faut donc penser à dégager le bloc suivant avec un clear:left."
Je ne comprends pas trop... sur le bloc suivant le Nav je dois ajouter clear:left ?

Merci pour ton aide !

Sub
Modifié par subran (08 May 2012 - 21:57)
subran a écrit :
Merci pour ta réponse.

Quand tu parles d'une liste avec un seul li... de quelle liste parles-tu ?

Le menu informatique.

subran a écrit :

Je vais essayer de mettre le second menu à droite.

Pourquoi un 2ème menu? Smiley rolleyes


subran a écrit :

Je ne comprends pas trop... sur le bloc suivant le Nav je dois ajouter clear:left ?

Non ça ne servira à rien, plutôt sur le suivant.
Hermann a écrit :

Pourquoi un 2ème menu? Smiley rolleyes

En fait ce menu est plus long et il y a plusieurs li mais uniquement accessible aux enseignants.
J'ai ajouté ce menu pour qu'ils puissent avoir accès à toutes les info du menu des utilisateurs normaux et avoir une vue claire de leur menu de l'accès enseignants.

Hermann a écrit :
Non ça ne servira à rien, plutôt sur le suivant.

Ok, j'ai ajouter clear:left; ici :

#main-avec {
width: 940px;
margin: 0 auto;
padding-top: 10px;
background: url(/assets/img/colbg.png) repeat-y;
overflow: hidden;
clear:left;
}


Je ne vois pas de changement , est-ce que le problème de sortie de flux est réglé ? Comment vois-tu cette sortie du flux ?

Encore un grand merci pour ton aide !

Sub
subran a écrit :


Je ne vois pas de changement , est-ce que le problème de sortie de flux est réglé ? Comment vois-tu cette sortie du flux ?

Pourtant je ne vois plus de chevauchement dans IE7. Smiley rolleyes
Mais tu as une différence entre IE7 et les autre navigateurs :
le bloc NAV n'englobe pas ses enfants flottants (puisque hors flux) alors qu'IE7 les englobe via certaines propriétés conférant le layout (voir les explication sur le haslayout) que sont ici min-height et width, d'où le fond beige de NAV qui s'étend sur toute la hauteur.
Modifié par Hermann (08 May 2012 - 23:35)
C'est avec l'ajout de
clear:left;
que je ne vois pas de différence mais sinon merci pour tes conseils cela permet de visiter "normalement" le site sous IE7

Je vais me documenter sur haslayout

Thanks a lot !!!

Sub