Technique INPUT + INPUT

Bonjour,
je suis en train de développer une admin client et pour faire propre, j'ai choisi ce type de mise en forme :

http://www.kachouri.com/tuto/tutoriaux/webmaster/formulaires/image1.jpg

Pour la civilité de mes clients j'ai donc suivi leur exemple :

<fieldset id="coordonnees">
  <p id="civilite"><label>Civilité : </label>
    <input type="radio" name="civilite" value="M." />M.
    <input type="radio" name="civilite" value="Mlle" />Mlle
    <input type="radio" name="civilite" value="Mme" />Mme
  </p>
</fieldset>

avec le style :

#civilite {
  font-size:90%;
}

#civilite input {
  margin-left:9em;
}

#civilite input + input {
  margin-left:1em;
}

Le probleme est que l'espace entre mes input radio sont de 9em même en appliquant la technique input + input.

Je ne comprends pas pourquoi. Je suis le tuto qui est à cette adresse : http://www.kachouri.com/tuto/tuto-177-faire-un-formulaire-html-css-php-1-sur-3.html

Merci d'avance

Bonjour,

input + input cible tout élément input qui suit directement un autre élément input. Pour ma part, je ne vois nulle part une telle construction dans le code que tu nous donne.

bah le

    <input type="radio" name="civilite" value="M." />M.
    <input type="radio" name="civilite" value="Mlle" />Mlle
    <input type="radio" name="civilite" value="Mme" />Mme

c'est des inputs qui se suivent non ?

jiojio a écrit :
bah le

    <input type="radio" name="civilite" value="M." />[b][#red]M.[/#][/b]
    <input type="radio" name="civilite" value="Mlle" />[b][#red]Mlle[/#][/b]
    <input type="radio" name="civilite" value="Mme" />Mme

c'est des inputs qui se suivent non ?

bah non, pas directement

et il faudrait contourner ça comment ?

jiojio a écrit :
et il faudrait contourner ça comment ?

Hé bien il y a plusieurs manières, tout dépend de ce que tu veux cibler exactement.

a écrit :
et il faudrait contourner ça comment ?

Vu le design final, tu peux appliquer un float:left aux labels, ça sera plus simple ensuite pour styler les input :

label{
float:left;
width:150px;
}
input{
margin-right:1em;
}

C'est une méthode mais bon y'en a d'autres...
Modifié par MrPatate (02 Apr 2007 - 14:32)

Pour le label j'ai ça moi :

#coordonnees label {
  position:absolute;
  padding-top:.2em;
}

#coordonnees input {
  margin-left:8em;
  margin-bottom:.1em;
  font-size:10px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
}

au fait dans l'exemple du site il y a M Mme Mlle à la fin des inputs et ça ne semble pas poser de pb