Boites et DIV en CSS2 = compatibilité navigateursRésolu

Question

Bonjour,


Ma question ouverte est la suivante :



En utilisant les bo&#238;tes en CSS2 (classe .boite par exemple) et
les propri&#233;t&#233;s : absolute, top, left, margin, padding, height et width,
je n'ai pas le m&#234;me r&#233;sultat visuel sous IE que sous FireFox. Sous IE
tout est correct, mais sous FireFox tout est d&#233;cal&#233;. Je place ces
boites dans des DIV pour &#233;muler des Frames.



Si vous souhaitez voir le r&#233;sultat : www.dolphin-zone.net avec IE et FireFox.



Ce post est certainement basique pour les initi&#233;s de CSS2, mais je
d&#233;bute dans le d&#233;v. Web (je connais bien le d&#233;v. Windows), et j'avoue
&#234;tre un peu d&#233;contenanc&#233; ...


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&#233;f&#233;rence ou un document, un livre ou autre ? Merci d'avance,



Rick

malalam · Accepted Answer

http://openweb.eu.org/articles/dimensions_boites_css/

cs_putch · Answer

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

malalam · Answer

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.

RickDangerous57 · Answer

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

RickDangerous57 · Answer

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

RickDangerous57 · Answer

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

Boites et DIV en CSS2 => compatibilité navigateurs

6 réponses

Votre réponse

Discussions similaires