Le formulaire se mélange au menu déroulant

Bonsoir,

j'ai inséré un formulaire dans mon site qui possède un menu déroulant.

tout est fini mais je viens de voir que quand je balade la souris sur le menu déroulant lorsqu'il croise le formulaire celui ci se mélange au menu.

<h2>Préinscription</h2>
<form method="post" action="traitement.php">
<p class="titre">Renseignements de l'élève</p>
<fieldset id="renseignements">
<label>Nom (de l'élève) : </label>
<input type="text" name="nom" size="25" maxlenght="40"/><br />
<label>Prénom : </label>
<input type="text" name="prenom" size="25" maxlenght="40"/><br />
<label>Date de naissance : </label>
<input type="text" name="date" size="15" maxlenght="10"/><br />
<label>Lieu de naissance : </label>
<input type="text" name="lieu" size="25" maxlenght="40"/><br />
<label>Frères et soeurs : </label>
<input type="text" name="frere" size="5" maxlenght="2"/><br />
<label>Classe actuelle : </label>
<input type="text" name="classe" size="25" maxlenght="40"/><br />
<label>Etablissement : </label>
<input type="text" name="ecole" size="25" maxlenght="40"/><br />
</fieldset>

      
				/*fieldset général*/
fieldset {
      border:none;
      margin-bottom:1em;/*espace entre les deux zone*/
      width:430px;/*24em;largeur des zones*/
      padding-top:10px;/*1.5em;espace entre haut de zone et le texte*/
      }
select {
      margin-left:30px;/*9em;espace entre les éléments à */
      margin-bottom:0;
      }
				/*fieldset renseignements*/
fieldset#renseignements {
      background:#e4f4ae;/*#A4D8EE;*/
      border:outset #A4D8EE;
      }
#renseignements label {
      position:absolute;/*alignement des zones teste sur les titres*/
      font-size:100%;/*taille de la police*/
      padding-top:5px;/*.2em;centrage du titre avec la zone */
      padding-left:2px;/*20px;espace à gauche*/
      }
#renseignements input {
      margin-left:9em;
      line-height:1.4em;
      margin-bottom:.2em;
      }

j'ai parcouru pas mal de forums qui parlent de problème avec IE mais pour l'instant je suis en local avec ubuntu et firefox.

Merci d'avance pour votre aide

Bonjour,

C'est sans doute le positionnement absolu des éléments LABEL qui pose problème. Ton sous-menu est sans doute positionné en absolu, tes LABEL sont positionnés en absolu et définis plus loin dans le code HTML, aucun de ces éléments n'a de propriété z-index définie, et donc au final tes LABEL sont affichés par dessus le sous-menu.

Deux solutions:
- Soit garder le positionnement actuel, et utiliser z-index.
- Soit modifier le positionnement de tes LABEL (en utilisant float ou display:table-cell par exemple).

La première solution sera la plus rapide à appliquer.