Boites et DIV en CSS2 => compatibilité navigateurs

Bonjour,

Ma question ouverte est la suivante :

En utilisant les boîtes en CSS2 (classe .boite par exemple) et les propriétés : absolute, top, left, margin, padding, height et width, je n'ai pas le même résultat visuel sous IE que sous FireFox. Sous IE tout est correct, mais sous FireFox tout est décalé. Je place ces boites dans des DIV pour émuler des Frames.

Si vous souhaitez voir le résultat : www.dolphin-zone.net avec IE et FireFox.

Ce post est certainement basique pour les initiés de CSS2, mais je débute dans le dév. Web (je connais bien le dév. Windows), et j'avoue être un peu décontenancé ...

Je pense en outre que beaucoup de novices en CSS2 comme moi se pose cette question.

Quelqu'un pourrait-il m'orienter vers un site de référence ou un document, un livre ou autre ? Merci d'avance,

Rick

salut !
comme tu es sur un forum php je te conseille d'aller voir sur www.alsacreations.com (site spécialisé dans le css).
il yt a une excellente FAQ ainsi qu'un tres bon forum

Hello,

au passage, c'est malheureusement sous IE que c'est décalé, et sous Firefox que c'est correct. Le modèle de boîte d'IE est différent de celui des recommendations du W3C. D'où le problème.

Ok ! Merci à vous pour vos réponses, mais j'ai posté un sujet identique sur un forum d'Alsacréation et je n'ai pas de réponse pour l'instant.

Je vais vérifier et essayer de mettre en conformité mon code, merci de l'info malalam

Bonne journée !

Rick

Bonjour,

Merci à malalam pour le lien vers la page, il résume bien mon problème et propose plusieurs solutions, reste à mettre en oeuvre :o)

Bonne journée,

Rick

Bonjour,

Petit rectificatif, après avoir testé les deux pistes de source CSS2 uniques pour un site compatible avec IExx et FireFox, sur le site d'OpenWeb, il en ressort que :

1- La spécification du DTD(Définition du Type  de Données) en mode STRICT / TRANSITIONNAL / XHTML etc. ne change rien au résultat sous IE6 ou FireFox 1.5xx, les navigateurs ne gèrent apparemment pas ça comme annoncé dans l'article. J'ai pourtant essayé toutes les DTD citées,

2- La méthode Hack Box qui consiste à spécifier par exemple deux propriétés comme { top et left } interprétable par IE en "modèle Microsoft" puis à ajouter derrière deux instructions (devant rendre IE aveugle) ces deux même instructions avec des coordonnées de type "CSS2 du W3C" pour que FireFox ou Netscape rectifie ces dernières ne fonctionne pas sous IE6. En effet, IE interprète ces données ... (l'exemple sur le site d'OpenWeb ne donne pas le résultat escompté non plus avec comme browser client : FireFox 1.5.01 et IE6.xx ....

Comment faire pour que deux propriétés aussi triviales que Top et Left par exemple soit interpretées correctement par IE5, 6, etc et FireFox avec une même source CSS2 ? Faut-il deux sources différents et un script JavaScript pour détecter le navigateur du client ?

Merci de m'éclairer dans ce brouillard ... il y a certainement une solution simple ...

Bonne soirée à tous

Rick