18073 sujets

Questions générales et questions de débutants

[RESOLU] Soucis avec mon menu et sous menu déroulant...

Pages :
Bonjour,
Jusqu'ici je n'avais réalisé qu'un site via FrontPage ( oui, oui, je sais une vrai dob je confirme ^^ ) et je me suis décidé à tout refaire " clean" en essayant de respecter au mieux les standard.
Voici ma page en question: Ma page test
Je en suis pas trop mécontent du résultat, sauf que j'ai des sous-menu à ajouter. J'aurais souhaitais les réaliser à l'image du Tuto Alsacreation présenté ICI
Sauf que javascript côté standard cela semble pas terrible notamment en terme d'accessibilité et surtout je n'arrive pas à l'adapter à ce que j'ai fais: je finis avec un fourbis qui part dans tout les sens et le côté " bouton" de chaque menu disparait...
Pour résumer, je suis un noob complet en CSS, j'ai des notions en html, et je n'arrive même pas à adapter le menu déroulant avec javascript proposé dans les tuto... Si on ajoute à ça deux jours de galère en vain pour l'adapter bin... Helpppppppppppp ^^
Quelqu'un peut m'aider?
Par avance merci :o)
Modifié par Artno (07 Oct 2005 - 18:03)
J'ai essayé de repartir de zéro côté menu et de ne pas faire un mixte du tuto et de ce que j'avais déjà...
Bilan j'obtiens toujours un menu qui part dans tout les sens et qui est loin d'être horizontal comme sur le tuto... De plus, l'aspect " bouton" n'est toujours pas présent.
Pour jeter un oeil voici le résultat: Mon test et pour rappel, ce que je cherche à obtenir visuellement mais avec des sous-menu: l'idéal
Merci de votre aide...
Personne n'a une piste à me fournir? Un indice pour m'expliquer où je plante complétement?

Merci par avance pour votre aide...
Oui j'en ai une mais ton adaptation n'est pas tres net Smiley confus

Pour avoir le menu à l'horizontal il faut ajouter (display: inline;) dans la partie (#menu li) de ton css Smiley langue

Bonne chance ^^
Merci je vais déjà essayé cela...
Qu'est ce que tu entends par " adaptation pas très net"? Qu'elle est le soucis? ( j'apprends donc j'essaye de comprendre ^^ )
Bon j'ai essayé en ajoutant ce que tu proposais, visuellement cela ne change rien...
Une autre idée?
( je commence sérieusement à desespérer...)
Artno a écrit :
Bon j'ai essayé en ajoutant ce que tu proposais, visuellement cela ne change rien...
Une autre idée?
( je commence sérieusement à desespérer...)

J'ai aussi essayé et ca à marché Smiley murf ton menu était horizontal en haut de la page mais en fouilli Smiley langue 
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
display: inline;
}

Modifié par webphn (06 Oct 2005 - 15:02)
tu m'avais indiqué le (menu li) d'où l'absence de modif chez moi... Je tente de ce pas...
Merci!
Euh je ne comprends vraiment rien de rien là... Je dois avoir trop la tête dans le guidon...

Je prends le code de la page /test2, j'applique ta modif, et j'ai toujours la même chose à l'écran: le menu reste en vertical :s

pour que tu puisse vérifier je l'ai mis en ligne: TEST2 ICI
voici ton css ou je n'ai fait que ajouter la ligne= display: inline;
/* CSS issu des tutoriels css.alsacreations.com */
body {
margin: 0;
padding: 0;
background-color: rgb(153, 0, 0);
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
color: rgb(153,0,0);
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#conteneur {
position: absolute;
width: 750px;
left: 50%;
margin-left: -375px;
}
#header {
height: 143px;
}
#haut {
height: 30px;
background-color:rgb(0,170,0);
}
#centre {
background-color:rgb(0,170,0);
text-align: justify ;
text-indent: 2em ;
line-height: 1.3em ;
}
#pied {
height: 40px;
text-align: center;
font-size: 0.75em;
line-height: 1.3em ;
background-color: rgb(0,170,0);
}

p {margin: 0 10px 0;}

a {color: rgb(152,0,0);
text-decoration: surligne;}

#menu {
position: absolute;
top: 0;
left: 0;
z-index:100;
width: 100%;
display: inline;
}
#menu dl {
float: left;
width: 12em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
display: inline;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
Merci de ton aide mais je crois que je vais pleurer...
J'ai effacé mon css, copié le tiens et collé pour être sûr d'être dans le vrai et... rien!
Le menu horizontale proposé par Alsa reste aligné sur la gauche et en verticale...
Je pense qu'il ne me reste plus qu'à me mettre une balle dans la tête :os
Je pense qu'il faudrait recommencer par bien definir les conteneurs du style:
<div = "conteneur">
<div id="entete">
<div id="menu">
<div id="contenu">
Pour trouver un confort au moment de la mise en page et de l'application des styles CSS Smiley confused
Que veux tu dire par " définir les conteneurs"? ( Pour rappel je suis un noob total, donc les termes techniques j'ai du mal)
Bonsoir,

Bon j'ai adopté ma technique radicale: quand ça marche pas on reprend tout depuis le début.

Bilan ça va beaucoup mieux, jugez plutôt: http://lagardedamakna.free.fr

Bien sûr il reste quelques hic:

- Je voudrais centrer mes menus en largeur, de manière à équilibrer l'espace entre le bord gauche et " accueil" et le bord droit et le dernier menu. Comment puis-je faire?

- Internet Explorer, en mauvais élève qui se respecte, me pose également un soucis: ma partie qui contient le menu est décalé sur la droite et je ne comprends pas pourquoi.

Quelqu'un peut m'aider?

Par avance merci...
Modifié par Merkel (06 Oct 2005 - 19:53)
J'oubliais également: pourquoi quand on accède à la page, les sous menus sont directement apparents? Oo
Modérateur
Si j'ai bonne mémoire, c'est parce que le fichier javascript ne s'exécute que lorsque tous les éléments de la page sont chargés, et c'est le javascript qui repli tes menus qui sont au départ dépliés.
Modifié par Merkel (06 Oct 2005 - 21:18)
C'est bizarre car la page une fois chargée, les sous menus reste ouvert jusqu'à ce que je balade dessus ma souris... Tu aurais une autre idée?
Et sinon pour les deux autres points, quelqu'un à une piste car je n'ai toujours pas trouvé...
Pour rappel:
a écrit :
Bien sûr il reste quelques hic:

- Je voudrais centrer mes menus en largeur, de manière à équilibrer l'espace entre le bord gauche et " accueil" et le bord droit et le dernier menu. Comment puis-je faire?

- Internet Explorer, en mauvais élève qui se respecte, me pose également un soucis: ma partie qui contient le menu est décalé sur la droite et je ne comprends pas pourquoi.


Par avance merci de votre aide Smiley cligne
Modifié par Artno (06 Oct 2005 - 21:40)
Pages :
Sujet clos
Aller à