Décalages margin / padding entre les différents navigateurs

Bonsoir à tous,
Voilà des semaines que je me creuse la tête à comprendre un problème essentiel : la compatibilité entre navigateurs :
Je dois mettre en place des formulaires sur mon site.
Or, j'observe des décalages dans les margin ou les padding entre tous les navigateurs testés : IE6 et 7, MF et Opera.
Comment corriger ces décalages intempestifs sans avoir recours aux hacks disponibles sur le net ?
Avez-vous déjà rencontré ce problème ?
Conaissez-vous des ressources pouvant me renseigner ?
J'ai pourtant fait très attention à la façon dont je code le css, à l'accessibilité et à la validité...
Je suis dans le flou.
J'attends vos lumières.
Merci

La balise universelle est déjà dans mon css, mais merci quand même...^^

ratdelabo a écrit :
La balise universelle est déjà dans mon css, mais merci quand même...^^

Bon...
Peut-être qu'un exemple en ligne ou un morceau de code serait plus explicite qu'un gros pavé de texte !

Ben alors pour moi, sauf erreur, le souci ne vient pas de là !!

Salut à tous et merci pour vos réponses. Après relecture, je dirais que mon problème vient surtout d'OPERA ^^
Voici un lien qui vous permettra de vous faire une idée:
http://urbame.free.fr/index.php?p=espacepro (décalage sous OPERA pour les inputs et le boutton VALIDER)
Par ailleurs, le décalage existe aussi dans l'espace "CONTACT"

Merci de m'aider
Modifié par ratdelabo (01 May 2007 - 23:25)

le lien est invalide ratdelabo

Non j'ai modifié, reessaye ^^

Pas étonnant que ça chevauche, avec ce genre de chose :

.identification_pro label {
font-size:0.8em;
font-weight:bold;
padding-left:5em;
padding-top:0.2em;
position:absolute;
}
.identification_pro input {
margin-left:14em;
}

Franchement, si tu maitrises mal le positionnement CSS, tu aurais intérêt à utiliser ici un tableau à deux colonnes. Le résultat sera nettement plus accessible (pas de chevauchement intempestif).

Dans ce que tu as fait :
- le positionnement absolu n'est pas adapté à ce genre de chose, c'est une erreur de l'utiliser ici ;
- les marges et padding latéraux dimensionnés en EM sont problématiques... en cas d'agrandissement du texte, la mise en page est mise à mal.

Bonjour,
Je ne pensais mal maîtriser à ce point le css o_O
Peux-tu m'expliuer pourquoi le positionnement absolu n'est pas de mise ici ?
Donc, si je résumé, il faut passer par un tableau pour afficher un formulaire ?
Dans le cas contraire, comment faire en sorte que les input soit aligner tous entre eux pour rendre la présentation plus agréable ?

ratdelabo a écrit :
Peux-tu m'expliuer pourquoi le positionnement absolu n'est pas de mise ici ?

Parce qu'il permet des chevauchements de contenus pour peu que le positionnement et le dimensionnement du texte ne soient pas très exactement maitrisés. Et comme on ne peut pas maitriser la taille du texte...

ratdelabo a écrit :
Donc, si je résumé, il faut passer par un tableau pour afficher un formulaire ?

Pas nécessairement. C'est une solution, bien plus robuste que l'utilisation du positionnement absolu. Mais il y en à d'autres.

Tu pourrais par exemple avoir un label flottant et de largeur fixe (en pixels ou en %), et un input avec une marge à gauche de la largeur du label flottant. Par contre, il faudra surveiller les dépassements de flottants.

C'est bon merci.
Je suis passé en float:left;
Et c'est beaucoup mieux lors du passage à opéra. J'ai joué avec des class pour fignoler l'alignement des champs.
Pouvez-vous me dire ce que vous en pensez ? Je n'ai fini que le lien : NOUS CONTACTER, et le lien ESPACE PRO.
Les autres sont à revoir encore.
Soyez sincères.
Merci.

Petite question supplémentaire concernant la mise en forme:
L'encadré en double bordure n'est-il pas "trop moche" ? ^^