Width CSS dans une liste non interprété sous Firefox

Bonjour,

J'ai une liste HTML je veux l'utiliser pour afficher un formulaire sous la forme "Nom du champ" et un peu plus loin la case à remplir.
Pour faire "propre", je veux que les cases soient toutes alignées.
J'utilise donc le code ci-dessous.

Code HTML:

<ul>
<li><span class="colonne_form">Nom du champ :</span><input type="text" value="champ1" class="textbox"></li>
</ul>

Code CSS:

.colonne_form{ width:200px;}

Sous IE, le code fonctionne parfaitement mais Firefox n'interprète pas de la même façon . Il n'interprète pas le width de la classe CSS et donc mes champs sont collés au texte les concernant.

Bonjour et bienvenue,
pour commencer un liste n'est pas un choix approprié pour ce que tu veux faire d'un point de vue sémantique.
Je te conseil de t'inspirer de ce modèle (pour l'alignement entres autres)

Pour répondre à ta question, le colonne_form{ width:200px;} ne s'applique pas car le span est un élément inline qui n'accepte donc pas les propriétés de taille. Si IE l'applique c'est qu'il a un comportement non conforme et que tu es en mode Quirks (non standard). Il faudra que tu ajoutes un doctype complet (a priori).
Voir le blog et les tuto pour des explications.
Modifié par Hermann (15 Sep 2007 - 00:47)

+1 pour les explications d'Hermann. Bien penser à corriger le Doctype pour toujours travailler en mode Standard et non pas en mode Quirks.

Je rajoute un petit lien pour une mise en page de formulaire sur deux colonnes:
http://web.covertprestige.info/test/27-formulaires-sans-tableaux.html

Merci pour les réponses