18041 sujets

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

[Resolu] Problème menu déroulant horizontal

Pages :
(reprise du message précédent)

Bonjour, je suis nouvelle, j'ai fais une recherche sur le forum et je tombe sur ce sujet qui correspond tout à fait à mon soucis du moment (je précise, je suis plus que débutante, je ne connais rien à l'HTML, et autre CSS...je tatonne). Ravie, je pense régler mon soucis avec vos réponses, et pourtant non, çà ne marche toujours pas.....j'ai toujours les sous menus qui apparaissent directement, sans rien faire............

Voici une copie de ce que j'ai, si vous pouvez m'aider :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <style type="text/css" media="screen"><!-- body {
margin: 0;
padding: 0;
background: #FFFFCC;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 2;
left: 2;
z-index:100;
width: 100%; /* correction pour Opera */
}
#menu dl {
float: left;
width: 12em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #FFFFCC;
border: 1px #990066;
margin: 1px;
}
#menu dd {
border: 1px #990066;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #990033;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
background: #eee;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #990033;
background-color: #FFFFCC;
padding: 5px;
border: 1px #990066; }
-->
  </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>
</head>
<body>
<div id="menu">
<dl style="color: rgb(153, 0, 0);">
  <dt onmouseover="javascript:montre();"><a
 href="Accueil.html" title="Retour &agrave; l'accueil">Accueil</a></dt>
</dl>
<dl>
  <dt onmouseover="javascript:montre(Le mariage);"><a
 href="">Le
mariage</a></dt>
  <dd id="Le mariage">
    <ul>
      <li><a href="Petite%20histoire%20du%20mariage.html">Petite
histoire du mariage</a></li>
      <li><a href="Coutumes%20et%20traditions.html">Les
coutumes et traditions</a></li>
    </ul>
  </dd>
</dl>
<dl>
  <dt onmouseover="javascript:montre('Les Préparatifs');"><a
 href="">Les
Pr&eacute;paratifs</a></dt>
  <dd id="Les Pr&eacute;paratifs">
    <ul>
      <li><a href="Preparatifs.html">R&eacute;troplanning</a></li>
      <li><a href="Les%20tenues.html">Les tenues</a></li>
      <li><a href="Repas%20et%20animation.html">Repas
et animations</a></li>
    </ul>
  </dd>
</dl>
<dl>
  <dt onmouseover="javascript:montre('La Cérémonie d'engagement');"><a
 href="">La
C&eacute;r&eacute;monie d'engagement
    </a></dt>
  <dd id="La C&eacute;r&eacute;monie d'engagement">
    <ul>
      <li><a href="La%20ceremonie.html">S'engager
autrement...</a></li>
      <li><a href="Exemples%20de%20ceremonies.html">Exemples
de
c&eacute;r&eacute;monies</a></li>
      <li><a href="Exemples%20de%20textes.html">Id&eacute;es
de textes</a></li>
      <li><a href="Musiques.html">Id&eacute;es
de musiques</a></li>
      <li><a href="Temoignages.html">T&eacute;moignages</a></li>
      <li><a href="Presse.html">On en parle dans la
Presse</a></li>
    </ul>
  </dd>
</dl>
<dl>
  <dt onmouseover="javascript:montre('Les autres cérémonies');"><a
 href="">Les autres c&eacute;r&eacute;monies
    </a></dt>
  <dd id="Les autres c&eacute;r&eacute;monies">
    <ul>
      <li><a href="le%20bapteme.html">Le Parrainage</a></li>
      <li><a href="exemple%20parrainage.html">Exemples
de
c&eacute;r&eacute;monie de parrainage</a></li>
      <li><a href="Exemples%20de%20textes%20parrainage.html">Id&eacute;es
de textes</a></li>
      <li><a href="les%20funerailles.html">Les
Fun&eacute;railles</a></li>
      <li><a href="Exemple%20de%20fun%E9railles.html">Exemples
de
c&eacute;r&eacute;monies de fun&eacute;railles</a></li>
      <li><a href="Textes%20pour%20des%20funerailles.html">Id&eacute;es
de textes</a></li>
    </ul>
  </dd>
</dl>
<dt onmouseover="javascript:montre('La Webmastrice');"><a
 href="">La Webmastrice
  </a></dt>
<dd id="La Webmastrice">
  <ul>
    <li><a href="Presentation.html">Pr&eacute;sentation</a></li>
    <li><a href="Pourquoi.html">Pourquoi ce site ?</a></li>
    <li><a href="Nous.html">Notre mariage</a></li>
  </ul>
</dd>
<dt onmouseover="javascript:montre();"><a
 href="http://laiciennes.actifforum.com/index.htm" title="Forum">Forum</a></dt>
</div>
<p></p>
<br>
</body>
</html>

Modifié par krys1306 (03 Jun 2007 - 20:58)
Pas d'idées ? je sais que le post initial est marqué comme résolu, peut être dois-je en créer un moi même ?
Pages :
Sujet clos
Aller à