Je souhaiterai faire un formulaire de contact sur mon site. Malheureusement, je n'arrive pas à positionner le formulaire de manière correcte. Sous firefox l'affichage n'est pas génial tout comme sous IE 6. Je souhaiterai laisser ~ 10px d'espacement entre le menu de gauche et le titre du formulaire ainsi que le formulaire en lui-même. Par ailleurs, je souhaiterai aligné à droite mes zones de texte.
Voici mon code CSS lié au formulaire :
/***Mise en forme du formulaire***/
#contact{border:none;
margin:0;
width:60%;
}
#titreForm, #piedForm{font-size:medium; font-family:Verdana, Arial, Helvetica, sans-serif;
letter-spacing: 1px;
color:#000099;
float:left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12 pt;
font-weight:bold;
}
#piedForm {text-align:right;
}
#piedForm input{font-weight:bold; margin-left:5px;
}
#corpForm {
margin:0;
padding:1em;
}
#corpForm fieldset {width:45%;margin-left:15px; font-style:normal;
}
#corpForm legend {font-size:small; font-weight:bold; color:#000099;
}
#corpForm p {padding: .2em 0;
margin:0 0 .2em 0;
}
#corpForm fieldset#contact label {float: left; width:80px; text-align:right; margin-left:15px; padding: 0 .5em 0 0; line-height: 1.8;
}
#corpForm label:hover, #piedForm input {cursor:pointer;
}
et voici le code html :
<form name="contact" id="contact" action ="*nicolas79" method="post" onsubmit="return checkForm(this);">
</form>
<div id="titreForm">Contact</div>
<div id="corpForm">
<fieldset id="coordonnées">
<legend>Vos coordonnées</legend>
<br/>
<p>
<label for="nom">Nom :</label>
<input type ="text" name="nom" id="nom" size="20" />
</p>
<p>
<label for="prenom">Prénom :</label>
<input type ="text" name="prenom" id="prenom" size="20" />
</p>
</fieldset>
</form>
---------------
Nic
