Salut à tous ,

je découvre ( depuis peu ) l'utilisation du CSS ( après ça sera le XHTML ), et dans mon cas l'apprentissage est semé d'embuche :o ( incompatibilité de mon site avec certains navigateurs , etc .).

Je suis en cours de création d'un site web ( site dans lequel je posterai mes créations numériques ( des montages photos appelé collages ), et voici mon problème actuel ( avant c t largement pire ) :

x Problème N°1 :
Je remarque qqs différences d'affichage disgracieuses selon les navigateurs ( IE et Firefox ).

En fait l'affichage qui me plait est l'affichage d'IE :

voici l'affichage sur IE


voici l'affichage sur Firefox


- au niveau du cadre ( cf schéma légende 1 ) : dans IE j'aime bien le rendu des traits discontinus ( la largeur , l'espacement , le rendu ( ton mauve sur ton saumon ) ; dans Firefox j'aime pas l'espacement entre les traits et le rendu ( ton mauve sur ton blanc cassé ).
Il y a-t-il possibilité d'obtenir le même rendu qu'IE sur Firefox ?

- au niveau de la bordure gauche ( cf schéma légende 2 ), je trouve que le cadre en trait discontinu est trop prêt de la bordure pour Firefox. Le problème c que si je change la valeur de l'espacement , ça rend tout bizarre sous Firefox ( les boîtes partent dans tous les sens ). Je sais qu'il y a des différence au niveau du calcul des boîtes entre IE et Mozilla , il y a-t-il possibilité de contrer cela ? peut-être forcer les navigateurs à utiliser le mode IE et non standard ou inversement ...

x Problème N°2 :
Il y a-t-il possibilité que le site remplisse automatiquement tout l'écran verticlament selon la résolution utilisé ( cf schéma légende 3 ) ? En somme que le barre du bas ( footer ) soit automatiquement collée à la barre du bas du navigateur .

Voilà , je galère pas mal , ceci dit je ne desespère pas car j'apprend au fur et à mesure des choses de mes lectures ( Openweb, alsacreation , etc . ) et de mes différents tests .

Merci à tous ceux qui ont lu mon message , et à ceux qui pourront peut-être y répondre ( même à une question , ça serait déjà sympa ).

A+

Pb. 1 :

- la grosseur du trait est réglable dans les deux navigateurs, il ne devrait pas y avoir de différence si tu en demandes un explicite

- l'espacement est lié au navigateur, rien n'indique nulle part cet espacement. Tu ne trouveras rien pour le régler. Des fois il convient chez l'un, des fois il convient chez l'autre. Dans l'ensemble : est-il grave que ce soit différent ? probablement pas

- pareil pour la couleur de fond, savoir si la bordure est faite sur la couleur interne ou externe. Il va falloir accepter que ça ne soit pas identique partout, ou alors mettre une bordure continue

D'une manière générale pour le 1, tu devrais éviter de te formaliser pour les différences de détail dans les rendus. Laisse donc au navigateur certaines liberté d'apréciation et de rendu : c'est son boulot. A ce propos je te conseille la lecture du Tao : http://pompage.net/pompe/tao/
La règle d'or c'est "n'essayes pas de tout controler". Contentes toi de faire un accès correct à tout le monde, ça sera déjà beaucoup.


Pb. 2 :

Si c'est un problème de box model (impossible à dire à partir des captures) tu pourras trouver la description du problème et des solutions sur Openweb : http://openweb.eu.org/articles/dimensions_boites_css/

Globalement encore : est-ce que une différence telle que sur la capture d'écran est importante ?

Pb. 3 :

La solution se trouve sur alistapart : http://www.alistapart.com/articles/footers/

Merci pour tes réponses ,

c quand même frustrant ces différences avec les navigateurs .
Sachant que Firefox est conforme aux standards du web donc l'avenir ( ? ) , je trouve ça dommage car moi je préférait l'affichage sur IE lol ( la façon de faire n'est peut-être pas logique mais plus logique d'un point de vue graphique je trouve ) .

Petite remarque en passant , on dit que les sites réalisés à partir de tableau posent beaucoup de problème selon les navigateurs , mais mis à part Lynx , je n'ai jamais vu le moindre problème en utilisant cette technique .

Ceci dit je vais persévérer dans l'apprentissage du css :yoot: .

Pour ce qui est du problème n°3 je vais tester ça dessuite, merci pour le lien .

Bah, franchement je ne vois pas en quoi des gros pointillés seraient plus logique que des petits, ni en quoi les pointillés se font sur la couleur de fond plutot que la couleur du contenu. Un jour tu veux l'un, un jour tu veux l'autre. Il est même probable que tu souhaites ce que te donne MSIE parce que tu as l'habitude de MSIE et de son rendu par défaut.

Faut simplement apprendre à lacher prise, le Web n'est pas fait pour être identique partout (c'est même tout le contraire)

Pour les navigateurs qui posent problèmes il y en a plein, mais en faisant les tableaux tu emploient déjà probablement les astuces nécessaires pour que ça passe sur les principaux, ça sans t'en rendre compte. Tu n'as jamais eu à faire des imbrications alors que tu comptais faire autrement ? jamais eu à faire des colonnes ou lignes de 1px, à rajouter des colonnes ou lignes parce que le navigateur n'arrivait pas à calculer tout seul les tailles ?
Maintenant ton problème c'est que tu regardes les "gros" navigateurs. L'exemple le plus flagrant c'est le navigateur oral pour ceu qui ont des déficiences visuelles. Une mise en page avec trop de tableau est incompréhensible. Ceci dit il y a d'autres exemples simples, par exemple Google qui risque de mal interpréter ta page si sa conception n'est pas naturelle.
Grosso modo si tu préfères les tableaux il y a déjà des moyens de réduire les problèmes :
- pas d'imbrication de tableaux
- peu voire pas de rowspan et colspan
- peu de colonnes et lignes
- faire en sorte qu'une lecture séquentielle du contenu soit compréhensible

si djà tu fais ça tu auras le principal (à défaut de faire correctement)