Mise en page pour Firefox...

[Pixame]

Bonjour,

A l'occasion d'un changement de version du CMS que j'utilise pour un site, j'ai décidé de recoder le design pour le rendre valide XHTML.

Mis à part le problème des sessions le code est valide XHTML 1.0 Transitional...

Le site s'affiche parfaitement sous IE. Par contre, sous Firefox, la mise en page n'est pas du tout respectée...

Décidément, à chaque fois que je me décide à convertir un site en XHTML, je me heurte au même problème... la mise en page est tout le temps ratée sous Mozilla !

Je crois que je vais pour ce design également repasser au bon vieux HTML qui s'affiche correctement sous tous les navigateurs...

La page en question : -http://www.cyber-collectivite.com

[Berberber]

pourquoi tu mets un tiret devant l'URL ??

[Jok]

Oula oui il y a du joli bug sous firefox

[LaurentDenis]

Le site s'affiche parfaitement sous IE. Par contre, sous Firefox, la mise en page n'est pas du tout respectée...

Désolé d'être un peu abrupt (Pas du tout désolé, en fait) :

Prendre IE comme navigateur de référence lors du développement CSS est sans doute la pire erreur possible (pas tout à fait, au-delà, il y a NS4.7...).

IE6 est actuellement le navigateur "récent" qui a le plus médiocre support CSS2 en termes de positionnement, de dimensionnement (box model, le problème de Pixame), de contenu géréné...

Le principe de base d'un développement rapide en CSS est :

- de prendre comme navigateur de référence un de ceux ayant le support CSS2 le plus étendu : Mozilla (FireFox), Opera, Safari.

- une fois la CSS callée selon le standard, voir le résultat dans les navigateurs "buggués" (internet Explorer) et chercher les hacks nécessaires ou laisser la page se dégrader tranquillement.

Le corollaire de CSS est en effet une petite révolution culturelle : admettre qu'une page ne soit pas rendue de la même manière partout. En partant par exemple de deux constats simples :

- un navigateut texte ou Web-TV n'en fera pas la même chose qu'un navigateur graphique.

- le navigateur graphique spécifique pour lequel le développeur se sera efforcé de développer le site ne donnera pas le même rendu chez moi, dès lors que j'ai des préférences et des styles d'utilisateur.

(Pixame: ce dernier point ne concerne pas l'erreur dans ta page ; le premier point est en revanche le fond de ton problème).

Modifié 21 Mai 2004 par LaurentDenis

[LaurentDenis]

Je crois que je vais pour ce design également repasser au bon vieux HTML qui s'affiche correctement sous tous les navigateurs...

J'en remets une couche, en fait (plus abrupte que la précédente, mais le chantage m'agace) :

Repasser au bon vieux HTML, non, ce n'est pas ça que tu es tenté de faire : ce qui te démange, c'est de rester dans des habitudes de codage qui ont certes fait leur preuves empiriques à l'époque où les standards étaient une illusion pour doux-dingues, mais qui ne sont plus justifiables ajourd'hui et qui, surtout, n'ont aucun avenir.

Ces habitudes ont pourtant indiscutablement un atout majeur et indiscutable : tu les connais du bout des doigts, à tel point que tu ne vois plus le coût de développement du bon vieux "cross-brower" à l'ancienne.

Bien-sûr, le développement "standard" aura aussi son coût. Un double coût, pour toi :

- celui, inévitable, lié aux implémentations plus ou moins suffisantes dans les divers navigateurs au regard de ton projet. Nous y avons tous droit. Mais quoi de neuf de ce point de vue par rapport au cross-browser à l'ancienne ? Si, une nouvelle chose, à l'usage : on y passe beaucoup moins de temps.

- celui, plus personnel, d'une remise en cause de l'acquis : oublier IE, oublier la page identique dans tous les navigateurs, faire en fonction de "ce que cela devrait être" et puis ensuite adapter à ce que c'est, plutôt que faire en fonction de ce que c'est un peu partout et perdre du temps à en tenir compte.

Ah ! C'est qu'il me mettrait de mauvais poil, l'animal. En pénitence, je chercherai le hack qu'il lui faut pour sa page si personne ne se dévoue...

Modifié 21 Mai 2004 par LaurentDenis

[Pixame]

Tout doux LaurentDenis... ce n'est pas la peine de sortir les crocs...

Tu dis que le principe de base est de développer avec Mozilla et non avec IE car ainsi on obtient un site parfait sous Mozilla qu'il ne reste plus qu'à l'adapter pour le rendre "correct" sous IE.

Je trouve qu'il s'agit là de la logique typique d'un militant pro-standard

Mais ma problématique est différente et n'est au contraire de la tienne pas militante mais pragmatique.

Mon but n'est en effet pas comme tu me le suggère de rendre mon site parfaitement adapté pour une minorité d'internautes et tout juste correct pour la grande majorité que représente les autres... Je cherche plutôt à ce que l'affichage du site soit parfaitement adapté à la grande majorité des internautes et qu'il soit au moins "consultable" pour les autres... Ces derniers étant marginaux, il ne sont pas ma priorité, je tiens seulement à les respecter en ne leur bloquant pas l'accès à mes sites... Tu comprendras donc que ma logique est avant tout d'avoir un site conforme avec IE tout en essayant de faire en sorte que les autres puissent y accéder (même si je conçois que tu ne partages pas cette optique !)

Ce qui me "démange", ce n'est donc pas de "rester dans des habitudes de codages" désuètes comme tu l'évoques, mais c'est de satisfaire la majorité de mes visiteurs sans exclure les "minorités" actuelles.

Tu vas sûrement me dire que c'est possible de faire des sites qui sont parfaits pour ces différentes catégories d'utilisateurs ! Je suis d'accord, mais comme tu le rappelles cela représente un "investissement". Or, internet n'est pour moi qu'un loisir, je n'ai ni le temps, ni les compétences, ni le temps d'acquérir les compétences, afin de réaliser celà ! Alors je cherche ce qui semble à mes yeux le meilleurs compromis.

Comme tu le soulignes toi même, ta réponse est un peu abrupte et semble ignorer la réalité d'une partie des webmasters qui ne cherchent qu'à mettre en ligne le plus simplement possible quelques informations... Je regrettes donc que ta réponse se soit limité à une petite "leçon" sans donner d'autres pistes de résolution que "Fallait pas travailler avec IE"...

Désolé d'avoir peut-être été moi aussi un peu long et "abrupt".

-----------------------------

-----------------------------

Cela dit, j'ai retravaillé un peu ma page... Les problèmes du header et du positionnement du corps de la page sont résolus.

Il me reste juste le problème du pied de page qui ne se colle pas en bas de page (ce qui est dommage pour un pîed de page...)

Je pense que le fait d'utiliser pour la colonne gauche un position:absolute; pose problème pour positionner le footer... mais si le type de positionnement de la colonne gauche, c''est le reste qui part en c......

La structure de la page est la suivante :

<div class="conteneur">

<div class="entete"></div>

<div class="colonnegauche"></div>

<div class="corps"></div>

<div class="footer"></div>

</div>

Le CSS des blocs principaux est celui-ci :

#conteneur { 
position: absolute;
width: 786px;
left: 50%;
margin-left: -393px;
background : #ffffff; 
padding : 0; 
} 

.entete { 
width : 786px; 
background-color : #ffffff; 
color : #FFFFFF; 
margin : 0; 
padding : 0; 
} 

.colonnegauche { 
position: absolute;
left:0;
width: 216px;
margin-top: 3px;
} 

.corps { 
margin-left: 226px;
padding-left : 5px; 
} 

.footer { 
text-align : center; 
height: 30px;
background-color : #AD0A0F; 
color: #FFFFFF; 
padding-top: 5px;
padding-bottom: 5px;
font-weight: bold;
width : 786px; 
}

Modifié 22 Mai 2004 par NT Koncept

[LaurentDenis]

Tu dis que le principe de base est de développer avec Mozilla et non avec IE car ainsi on obtient un site parfait sous Mozilla qu'il ne reste plus qu'à l'adapter pour le rendre "correct" sous IE.

Je trouve qu'il s'agit là de la logique typique d'un militant pro-standard

Non, il n'y a aucun rapport. C'est juste un point de vue technique.

Conseiller de développer d'abord pour les navigateurs qui ont le meilleur support CSS est simplement le fruit de l'expérience : c'est la méthode la plus rapide et la plus efficace.

Développer pour un navigateur dont le support CSS est médiocre, quelque-soit ce navigateur, et devoir ensuite adapter une feuille de style mal conçue au départ... ne fait qu'entraîner d'inutiles pertes de temps.

[edit: typos]

Modifié 22 Mai 2004 par LaurentDenis

[Dinostrate]

Salut à tous

Je voudrais essayer de poser ce débat de la manière la plus calme possible. Faut pas s'énerver sinon, on n'aboutit à rien....

C'est vrai que c'est difficile ces histoires d'incompatibilités.... et de navigateurs plus ou moins vasouillards....

Perso, à force d'en baver un peu, je commence à être "meilleur" en testant d'abord sur Mozilla ou la famille des "respectueux" : c'est plus facile de modifier pour que sa majesté IE comprenne quand on a essayé "de bien faire d'abord correct". J'avais commencé en faisant le contraire, et là, bonjour la galère.

J'ai découvert un lien qui donne les filtres css permettant d'adapter les règles d'affichage en fonction des navigateurs, le premier de la liste est le plus connu...

http://centricle.com/ref/css/filters/

NT concept > Je ne suis qu'un amateur, mais c'est drôle, j'ai une attitude parfaitement inverse à la tienne... comme je n'ai pas d'intérêt commercial, je ne suis obligé à rien, donc, je dois essayer de faire au mieux. Un site sérieux ne se fait jamais à la va-vite.

Et les pros, ils verront bien avec le temps qui joue en leur défaveur s'ils ne veulent pas se mettre à la page.

Mais cela ne signifie pas que je sois d'accord avec toutes les recommendations du w3c : je trouve que certaines (très peu nombreuses) sont inapropriées ou mal établies.

Au fait, j'ai aussi des préférences : je n'utilise jamais la position absolute et j'évite un maximum les dimensions fixes.

Dino