Sujet Précédent Sujet Suivant

Comment rajouter un menu

Résolu
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009 - 7 mai 2009 à 21:56
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009 - 9 mai 2009 à 09:18
Bonjour je viens de faire un nouveau menu pour un site mais voila le
dernier onglet jeux n'apparais pas sur la page d'accueil il me manque
quoi merci de vos réponses.

<html>

<head>
<meta http-equiv= "Content-Language" content="fr">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
</head>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<title>Page1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css" media="screen">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
li {
margin: 0;
padding: 0;
list-style-type: none;
}
ul {
margin: 0;
padding: 0;
list-style-type: none;
}
dd {
margin: 0;
padding: 0;
list-style-type: none;
}
dt {
margin: 0;
padding: 0;
list-style-type: none;
}
dl {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 0;
left: 0;
}
#menu {
width: 15em;
}
#menu dt {
cursor: pointer;
margin: 2px 0;;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
border: 1px solid gray;
background: #ccc;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu li a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu dt a:hover {
background: #eee;
}
#menu li a:hover {
background: #eee;
}
-->
</style>

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>

* :
Accueil

* :
Baby Gym

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

photo</li>
<li style= \"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.5</li>

<dt onmouseover=\"javascript:montre('smenu3');\"
style=\"cursor: pointer; height: 20px; line-height: 20px; text-align:
center; font-weight: bold; list-style-type: none; border: 1px solid
gray; margin: 2px 0; padding: 0; background: #FFFFFF\">
Gym

<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.5</li>

* Grs :

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 4.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 4.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 4.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 4.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 4.3</li>
<dl style=\"list-style-type: none; margin: 0; padding: 0\">
<dt onmouseover=\"javascript:montre('smenu4');\"
style=\"cursor: pointer; height: 20px; line-height: 20px; text-align:
center; font-weight: bold; list-style-type: none; border: 1px solid
gray; margin: 2px 0; padding: 0; background: #FFFFFF\">
Jeux

&nbsp;

&nbsp;

</html
>

14 réponses

Réponse 1 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
8 mai 2009 à 13:59
super merci a toi vous avez beaucoup de patiente pour moi qui suis novice dans ce domaine j'essaye d'apprendre.Mais ce n'est pas facile.
merci encore
3
Réponse 2 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
8 mai 2009 à 09:49
Salut,

Quand ce type de pb se pose la première chose à faire et d'indenter, espacer, sauter des lignes, mettre des commentaires un peu partout pour clarifier le code. Tu t'apercevras alors très vite qu'il y a des balises non fermées, qu'il manque la plupart des lignes à l'onglet jeux, etc ...

<html>

<head>
<meta http-equiv= "Content-Language" content="fr">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
</head>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<title>Page1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css" media="screen">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
li {
margin: 0;
padding: 0;
list-style-type: none;
}
ul {
margin: 0;
padding: 0;
list-style-type: none;
}
dd {
margin: 0;
padding: 0;
list-style-type: none;
}
dt {
margin: 0;
padding: 0;
list-style-type: none;
}
dl {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 0;
left: 0;
}
#menu {
width: 15em;
}
#menu dt {
cursor: pointer;
margin: 2px 0;;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
border: 1px solid gray;
background: #ccc;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu li a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu dt a:hover {
background: #eee;
}
#menu li a:hover {
background: #eee;
}
-->
</style>

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>

* :
Accueil

* :
Baby Gym

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

photo</li>
<li style= \"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.5</li>

<dt onmouseover=\"javascript:montre('smenu3');\" style=\"cursor: pointer; height: 20px; line-height: 20px; text-align: center; font-weight: bold; list-style-type: none; border: 1px solid gray; margin: 2px 0; padding: 0; background: #FFFFFF\">
Gym

<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.5</li>

<!-- exemple d'un onglet indenté (à la va vite), c'est un peu plus claire, non ? -->
<!-- début onglet Grs -->
  *   Grs
 
  :
   
      <li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.1
      </li>
      <li style= \"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.2
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
   
 

<!-- fin onglet Grs -->

* Jeux :

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 5.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 5.2</li>

&nbsp;

&nbsp;

</html>

Par ailleurs il faut que tu remplaces tes liens 'file:///C:/alain...' par des chemins relatifs ou absolus sinon ça ne fonctionnera pas sur une autre machine.

Cordialement,

Kohntark -
0
Réponse 3 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
8 mai 2009 à 14:35
Bon courage

Kohntark -
0
Réponse 4 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
8 mai 2009 à 23:21
catastrophe le menu descend trop bas merci de regarder kohntark
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
9 mai 2009 à 06:37
Tu as des height de 100% sur des balises inline (a, li, ...), ce qui n'est pas un attribut correct pour ce type de balises. Tu dois pouvoir les supprimer sans pb.
Et puis le div id=menu => height: 54991px; !!! est ce bien raisonnable ?

Kohntark -
0
Réponse 6 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 07:54
merci de ta reponse mais je ne trouve pas la solution
0
Réponse 7 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
9 mai 2009 à 08:37
Qu'est ce que tu ne comprends pas au juste ?

Je te l'ai donné la solution : supprimer les height qui n'ont rien à faire sur les balises <li>, etc ...
Il y en a dans le style déclaré en début de page et dans le style des balises elles mêmes.

Le height: 54991px; est "monstrueux" ça te fait une page ultra longue alors qu'il n'est peut être pas nécessaire de le mettre. Passe le à 1000 (par exemple) en attendant.

Cordialement,

Kohntark -
0
Réponse 8 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 08:40
j'essaye merci
0
Réponse 9 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 08:58
voila si je me suis pas trompé c'est ca

<html>


<head>
<meta http-equiv= "Content-Type" content="text/html; charset=windows-1252">
<title>Accueil</title>
</head>





<html>


<head>
<meta http-equiv="Content-Language" content="fr">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
</head>




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<title>Page1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css" media="screen">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
li {
margin: 0;
padding: 0;
list-style-type: none;
}
ul {
margin: 0;
padding: 0;
list-style-type: none;
}
dd {
margin: 0;
padding: 0;
list-style-type: none;
}
dt {
margin: 0;
padding: 0;
list-style-type: none;
}
dl {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 0;
left: 0;
}
#menu {
width: 15em;
}
#menu dt {
cursor: pointer;
margin: 2px 0;;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
border: 1px solid gray;
background: #ccc;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu li a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu dt a:hover {
background: #eee;
}
#menu li a:hover {
background: #eee;
}
-->
</style>


<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>




* :
Accueil


* :
Baby Gym

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

photo</li>
<li style= \"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 1.5</li>




<dt onmouseover=\"javascript:montre('smenu3');\" style=\"cursor: pointer; height: 20px; line-height: 20px; text-align: center; font-weight: bold; list-style-type: none; border: 1px solid gray; margin: 2px 0; padding: 0; background: #FFFFFF\">
Gym

<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.2</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.3</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.4</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 3.5</li>


<!-- exemple d'un onglet indenté (à la va vite), c'est un peu plus claire, non ? -->
<!-- début onglet Grs -->
  *   Grs
 
  :
   
      <li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.1
      </li>
      <li style= \"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.2
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
      <li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">
       
        Sous-Menu 4.3
      </li>
   
 

<!-- fin onglet Grs -->




* Jeux :

<li style =\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 5.1</li>
<li style=\"text-align: center; list-style-type: none; margin: 0; padding: 0; background: #fff\">

Sous-Menu 5.2</li>


 



&nbsp;

&nbsp;




</html>


</html>


</html>
0
Réponse 10 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 09:14
le départ pour moi c'était ce menu pour refaire mon site ensuite je me sert de frontpage pour la suite
0
Réponse 11 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
9 mai 2009 à 09:14
C'est mieux

... et c'est pire !!
Pourquoi donc as tu rajouté toutes ces balises html, body, head ?

Kohntark -
0
Réponse 12 / 14
kohntark Messages postés 3705 Date d'inscription lundi 5 juillet 2004 Statut Membre Dernière intervention 27 avril 2012 30
9 mai 2009 à 09:16
Croisement de messages, ceci explique cela.
Il est très important que tu corriges tous ces pbs de balisages doubles sinon tu vas avoir des pbs d'affichage, de référencement, etc ...

Kohntark -
0
Réponse 13 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 09:16
pardon j'ai repris celle de frontpage
0
Réponse 14 / 14
alaindu_33 Messages postés 25 Date d'inscription dimanche 22 mars 2009 Statut Membre Dernière intervention 20 août 2009
9 mai 2009 à 09:18
t'est un chef super de m'avoir consacré du temp merci a toi
0

Discussions similaires

menu en c
sebz10 -
decricri62 -

4 réponses
comment créer un sous menu
msi79 -
msi79 -

8 réponses
créer un menu principal
cs_valsta -
valsta -

5 réponses
Menu et sous menu
tennisman59 -
maili20 -

11 réponses
[C] Retour au début du programme
cs_thekid06 -
CptPingu -

3 réponses
Rejoignez-nous