Version complète: sur le forum Webmaster Hub : Formulaire contact. problème compatibilité ?
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
flux37
Bonjour,

J'aurais besoin de votre aide pr l'habillage d'un formulaire en css ..
Je l'ai testé sous I.E 6 ,5.5 , 5.01 .. opéra, mozilla et ça fonctionne..

ça donne par contre ça sous firefox et netscape :


1. Sous firefox , dans le champ texte, ça scroll en largeur.. Il n' y a pas donc pas de retour à la ligne..
2. Sous Netscape les labels n'apparaissent même pas.. ;(

peut-être pourrez vous m'expliquer ce que je peux ajouter ou ce qui ne va pas dans ce script..

merci bcp d'avance,


Flux37

voici lex html :

CODE
<form action="mailto:contact_AT_casasud-deco.com" method="post">
<div class="row"><label class="col1">Nom</label>
<span class="col2"><input name="name" class="input" type="text" id="name" size="39" tabindex="1"  /></span>
</div>
<div class="row"><label class="col1">E-mail</label>
<span class="col2"><input name="email" class="input" type="text" id="email" size="39" tabindex="2" /></span>
</div>
<div class="row"><label class="col1">Objet de la demande </label>
<span class="col2"><input name="website" class="input" type="text" id="website"  size="39" tabindex="3" /></span>
</div>
<div class="row"><label class="col1">Message</label>
  <span class="col2comment">
  <textarea cols="60"  maxlength="60"class="textarea" rows="5" name="comment" id="textarea" tabindex="4" ></textarea>
  </span></div>
<div align="right" class="submit"><input type="image" src="/images/bt_precommande.gif" alt="send" width="178" height="22" border="0" />
</div>
</form>


et voilà le css


CODE
form {
width: 350px;
}

.col1 {

font-family: arial, helvetica, sasn serif;
font-size: 0.8em;
font-weight : normal;
color: #382215;
text-align: left;
width: 90px;
height: 31px;
margin-top: 5;
margin-right: 10;
float: left;
background:  url(../images/) no-repeat;

}

.col2 {
    
    width: 250px;
    height: 31px;
    display: block;
    float: left;
    margin: 0;
    background:  url(../images/) no-repeat;
}

.col2comment {

width: 50px;
height: 110px;
margin: 0;
display: block;
float: left;
background:  url(../images/) no-repeat;

}

.col1comment {

font-family: arial, helvetica, sasn serif;
font-size: 0.8em;
font-weight: normal;
color:  #382215;
text-align: left;
width: 250px;
height: 98px;
float: left;
display: block;
background: url(../images/) no-repeat;

}

div.row {

    clear: both;
    width: 350px;
}

.submit {
  
    height: 29px;
    width: 350px;
    background: url(..images/) no-repeat;
    padding-top: 5px;
    padding-right:20px;
    clear: both;
}

.input {

    background-color: #fff;
    font: 0.7em Arial, Helvetica, sans-serif;
    color:  #382215;
    margin: 4px 0 5px 8px;
    padding: 1px;
    border: 1px solid  #ccc;
}

.textarea {

    border: 1px solid  #ccc;
    background-color: #fff;
    font: 11px/14px  Arial, Helvetica, sans-serif;
    color:  #382215;
    margin: 4px 0 5px 8px;
    
}
jeanpierre949
Salut ,
on peut voir ta DTD stp?
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.