[resolu]Aide sur menu petit bug

Salut,


Ma page est encore en cours de réalisation, j'essaye de faire ce que je peux pour tout faire en css et respecter les standards web.

J'ai quelques petits problèmes, de façon générale le menu s'affiche correctement sur firefox mais sur ie il y a un clignottement et le menu se met verticalement au lieu d'horizontalement.

Sur k-meleon, lors du survol le menu bouge

Voici l'adresse : http://www.thermofloc-benelux.com/essai/absolumodele.htm

et l'adresse de la feuille de style de ce menu : http://www.thermofloc-benelux.com/essai/nvmenu.css

Je dois encore optimiser le code, les images , rajouter des trucs, menu d'évitement (je sais pas ou le mettre), ...


Si vous avez le temps de regarder (peut être même commentaire sur le design), merci


Yanic
Modifié par yanic (27 Jan 2006 - 20:44)

Juste un commentaire sur un point précis : évite autant que possible les changements de taille de texte ou de graisse au survol sur les liens. Les liens de ton sous-menu passent en caractères gras au survol, ce qui décale tout d'une manière assez perturbante... tandis qu'il y a d'autres moyens pour indiquer une interactivité possible (changement de couleur, de soulignement, d'image de fond, etc.).

Sur le design : c'est très vert et du coup ça manque un peu de touches dans d'autres couleurs, plus chaudes... ou de couleurs plus neutres.
Modifié par mpop (23 Jan 2006 - 20:00)

Oki merci je vais faire les modifications j'ai résolu les petits problèmes qu'il existait, pour le vert oui je vais essayer de mettre un peu plus de couleur.

Mais c'est un site "vert/ecolo" et je ne suis pas super fort pour le design et les couleurs malgré l'achat de bouquin !

Sinon quelqu'un peut m'aider sur le survol du menu qui ne s'affiche pas correctement horizontalement, est ce parce que j'ai display: inline et que ie l'interprete mal ??

Merci

J'ai mis les correctifs en ligne.

Yanic

Voila voila j'ai trouvé l'erreur.

Juste une dernière chose, les sous menus sous ie ne prennent pas toute la largeur, quelqu'un peut m'aider ?


Merci


YAnic

Bonjour,


Comme "mpop" te la conseillé, un peu de couleur autre que le vert ferait du bien...

L'apport d'une troisième couleur serait bien, donc si je peut me permettre...

Voici mon avis :

pour la couleur des titres de boites: news,..., je remplacerais le noir par un orange afin de marquer l attention

pour ton sous-menu : enlever le blanc en background et appliques plutot cette couleur sur le texte (ont distinguera mieux les liens et surchagera beaucoup moin cette partie du site) et au survol de ceux-ci, reprendre l orange.

Pour l image (maison) ce trouvant a droite de ton Header, essaies d'enlever le fond brun qui l'entoure, et remplaces le par du blanc, afin que l'image s integre mieux.


Voilà... si tu fais l essaie j'espere qu il te plaira.


A bientot et bonne chance pour ton probleme...
Modifié par Connexion (24 Jan 2006 - 05:28)

Merci pour cette réponse, le fond blanc, c'était pour distinguer le menu pour bien voir la dimension qu'il avait pour faciliter la résolution du problème.


Je vais essayer de modifier un peu les couleurs, mais le problème principal est bien le sous menu, si ca ne marche pas je devrais trouver une autre solution


Yanic

Salut,

J'ai trouvé le problème, le sous menu s'affiche sous son menu correspondant, en prenant la place qu'il reste à droite.

J'ai essayé tout pour qu'il se mette à gauche et qu'il prenne toute la place disponible mais je ne trouve pas la solution.

Voila le code:

a écrit :
/* le menu */
#menuhaut {
list-style-type: none;
height: 65px;
margin: 0;
padding-left: 5px;
background-image: url(fond.gif);
font: 1em/1.2 'times' sans-serif;
}
#menuhaut dl {
float: left;
margin: 2px 5px 0 0;

}
#menuhaut dt {
letter-spacing: 0.1em;
text-align: center;
border: 1px outset #49B46E;
background-color: #49B46E;
font-weight: bold;
margin-right: 5px;
margin-left: 5px;
padding: 2px 15px;

}
#menuhaut ul {
background-color: #FFFFFF;
margin: 0 0 0 5px;
padding: 0;

}
#menuhaut li {
display: inline;

}
#menuhaut dd {
position: absolute;
left:0;
padding-top: 5px;
font-size: 0.8em;
display: none;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}

#menuhaut dt a {
text-decoration: none;
color: #000000;

}
/*#menuhaut dd a {
padding: 1px 4px;
margin-right: 1px;
margin-left: 1px;
padding: 2px 2px;
}*/
#menuhaut li a:hover, #menuhaut li a:active {
text-decoration: underline;
color: #000066;
}

/* class dynamique */
#menuhaut .montre dd {
display: block;

}
#menuhaut .montre dt {
background-image: url(vert.jpg);

}

#menuhaut li a{
text-decoration: none;
color: #000000;
margin-right: 2px;
margin-left: 2px;
padding: 2px 2px;
}

Peut être n'y en a-t-il pas


Yanic
Modifié par yanic (24 Jan 2006 - 22:20)

Yala wakba !

J'ai trouvé, il suffisait de rajouter : white-space: nowrap; pour le "ul"

J'en reviens pas d'avoir trouvé tout seul !


Yanic

Ha non ca marche pas le retour du texte quand on redimensionne ou augmente la taille ne se fait pas


Yanic