[Résolu]Décalage des inputs sous firefox ...

Bonjour

Je suis en train de créer un module intranet et je suis en train de refaire la mise en page en utilisant des css plutôt que des tableaux.
Le truc, c'est qu'en css c'est pas encore ça, à vrai dire c'est mon premier fichier css hihi

Alors, là c'est pour un formulaire dans une petite page (voir l'image plus bas).
Je voulais que les input de type text soit bien tous alignés, sous IE j'ai réussi nickel, mais sous firefox, ils ne sont pas alignés à gauche
Je ne trouve pas pourquoi ...

Donc voici une partie de mon fichier css (juste pour aligner les input correctement) :

label
{
	width : 90px;
	margin-left : 10px;
	font-size : 16px;
	font-style : italic;
	color : #000000;
}

.champDroit
{
	float : right;
}

.champGauche
{
	float : left;
}

Et la création des input (c'est en php, et là c'est pour les deux premières lignes) :

echo ("<div class='champGauche'><label for='adresse'>Adresse : </label><input type='text' id='adresse' name='adresse' value='' /></div><div class='champDroit'><label for='cp'>Code postal : </label><input type='text' id='cp' name='cp' value='' /></div>");
echo ("<br />");
echo ("<div class='champGauche'><label for='localite'>Localité : </label><input type='text' id='localite' name='localite' value='' /></div><div class='champDroit'><label for='pays'>Pays : </label><input type='text' id='pays' name='pays' value='' /></div>");

Donc voici l'aperçu de ma page sous IE :


Et maintenant l'aperçu des deux premières lignes sous firefox (même si ça le fait pour toutes les lignes) :


Peut-être que j'ai mal procédé pour aligner tout ça ... (parce que j'ai déjà un div qui imbrique ceux pour les lignes, un div général qui contient tout en fait).

Je vous remercie d'avance pour votre aide, et si jamais quelque chose de similaire a déjà été posté, et bien désolée j'ai dû le rater.
Modifié par poopsinou (24 Apr 2006 - 08:51)

Bon je vais passer pour une imbécile, parce que là j'ai le même rendu !! Ce matin ça marchait sous IE, je comprend plus (et je me rappelle plus de ce que j'ai pu changer après que ça ait marché )... La poisseeeee!!!!

Bon, pour IE j'ai retrouvé mon erreur, ça venant du DOCTYPE de ma page.
Donc sous IE, j'arrive à aligner mes champs comme dans l'image suivante, mais pas sous firefox.

Je me réponds toute seule

Non en fait je continue de chercher activement pour voir si je trouve.
J'ai utilisé la technique des couleurs pour voir les marges, les tailles de mes objets, etc etc, et j'ai remarqué que sous firefox, il s'en fichait que je lui mette :

label
{	
	width : 90px;
    ......

Alors peut-être que mon problème vient de là (sûrement même!) mais alors comment donner un taille à mon label dans mon css pour que ça marche également sous firefox?? (parce que cette "technique" d'alignement, je l'avais trouvé sur le web et il disait que ça marchait pour tout. Bon, moi après j'ai rajouté des div pour faire un aspect de colonnes, mais bon ...)
Modifié par poopsinou (20 Apr 2006 - 17:06)

J'arrive toujours pas à résoudre le problème sous firefox, il ne tient pas compte de la taille que j'impose ... alalalalala

poopsinou a écrit :
J'arrive toujours pas à résoudre le problème sous firefox, il ne tient pas compte de la taille que j'impose ... alalalalala

Salut,
C'est normal, LABEL est un élémént inline, et contrairement aux éléments remplacés (img, input etc..) ou aux éléments de type bloc (P, DIV etc..) on ne peut leur donner une hauteur ou largeur que s'ils sont affectés, pas exemple, par display: block (ou "table", "table-cell"...), float ou encore un positionnement absolu (ou fixe)...
Dans ton cas tu as plusieurs possibilités mais tu peux simplement utiliser float.
Modifié par Alan (22 Apr 2006 - 10:52)

Ok là tout de suite je peux pas tester, mais je vais le faire.
Mais j'ai une question, si je peux pas mettre de taille au label, pourquoi sous IE je peux??

Avec IE ce n'est possible qu'en Quirks mode. Contrairement à ce que tu as dit plus haut, l'erreur ne vient pas du DOCTYPE, mais en le modifiant ou supprimant, tu as fait simplement basculer IE en mode Quirks.
Cf : Choix d'une DTD: le doctype switching n'est pas pour nous
Modifié par Alan (22 Apr 2006 - 11:18)

je ne connaissais pas du tout, ok ok !!
Au fait j'ai oublié, bonjour et merci pour la réponse

Si j'ai bien compri faut que le label soit en block (c'est ce que j'avai vu au départ sur les sites ...), ou alors faut faire ce que tu as dis, c'est ca?? Désolée j'suis un peu nulle de ce côté, alors je m'assure d'avoir bien compri avant de revenir crier que ca ne marche pas !

poopsinou a écrit :
Si j'ai bien compri faut que le label soit en block

Pour lui donner une largeur, pas forcément. Comme dit ci dessus, avec simplement float ou position:absolute, c'est possible.
Modifié par Alan (22 Apr 2006 - 12:04)

Ca marcheeee

Merci merci beaucoup beaucoup !!

(j'ai utilisé float )

ben comment on fait pour dire que c'est résolu ?? lol