Site décalé à droite sous Mozilla

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
Vrony
Arias
Messages : 3
Inscription : 21 mars 2008, 12:24

Site décalé à droite sous Mozilla

Message par Vrony »

Bonjour,

Webmestre improvisée, j'ai fait mon site avec dreamweaver.
Il est ok sous IE mais toute la frame centrale est décalée sous Mozilla, sur TOUT le site...
Une âme charitable voudra t'elle m'aider ?

www.tsunami.fr

Merci !

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.12) Gecko/20080201 Firefox/2.0.0.12
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Le code de la page n'est pas valide, il contient des erreurs HTML : http://validator.w3.org/check?verbose=1 ... nami.fr%2F
dont visiblement quelques problèmes d'imbrication des balises qui pourraient tout à fait faire "sauter" ta mise en page selon l'interprétation des erreurs (qui n'est pas standardisée).

Même si ça n'a aucun rapport avec le problème, je te recommande de donner des textes alternatifs à tes images : http://www.la-grange.net/accessibilite/day_23.html

Ensuite le doctype que tu as choisi fait basculer Firefox au moins en mode non standard. Son comportement est alors totalement imprévisible. Donne un doctype qui mette Firefox en mode standard.

Finalement, dans ta feuille de style je vois des "left:-999em" : il y a toutes les chances pour que cet élément ne soit pas affiché. Vérifie que tes CSS sont correctes (même si elles sont valides syntaxiquement).

Il y a des chances qu'après tout ça ton site s'affiche mieux ;-)

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.12) Gecko/20080207 Firemarsupilami/7.10 Firefox/2.0.0.12
Asumbaa
Tyrannosaurus Rex
Messages : 2411
Inscription : 08 déc. 2004, 20:07

Message par Asumbaa »

Salut,

Tu oublies de fermer ta div "container". Il manque :

Code : Tout sélectionner

</div>
juste avant la fermeture du body.

Par ailleurs tu travailles avec un DOCTYPE tronqué qui amène les navigateurs à afficher ta page en "mode Quirks" (c'est-à-dire comme ils le sentent, et ils sentent différemment les choses)

A lire :
Toi comprendre moi ?
Comment choisir sa DTD


Edit : grillée, mais au moins on dit la même chose globalement :)
Vrony
Arias
Messages : 3
Inscription : 21 mars 2008, 12:24

Problème persistant

Message par Vrony »

Bonjour,

Merci pour vos réponses: j'ai tout bien fait selon vos conseils, et pourtant...
J'ai completé le doctype avec ue seconde ligne.
J'ai fermé la balise </div>
J'ai corrigé les bugs mentionnés sur Validator
J'ai changé le -999em de la feuille de style en -50em (je comprends pas grand chose encore aux css)

J'ai gagné un site qui foire maintenant aussi sous IE...

Bref, je ne suis pas au bout de mes soucis. J'ai mis en ligne la page d'accueil www.tsunami.fr avec les modifs, si vous auriez la gentillese d'aller jeter un oeil...

Merci

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322)
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Re: Problème persistant

Message par calimo »

Vrony a écrit :(je comprends pas grand chose encore aux css)
C'est pourtant très utile ! :)
Il y a un sujet liens utile en haut de cette rubrique du forum, je te conseille en particulier http://www.alsacreations.com/ et http://www.siteduzero.com/tuto-3-6-0-ap ... e-web.html :wink:

Lorsque tu appliques float:left sur ton menu, tu le sors du flux, et tout ce qui vient ensuite est affiché à droite du menu... y-compris le tableau ! Il faut alors jouer avec les propriétés clear pour tout faire repasser à la ligne :wink:

Dans ce genre de cas, ce qu'il faut faire c'est supprimer du code petit à petit jusqu'à ce que le problème disparaisse : tu as alors identifié sa cause.

Quelques petites remarques générales :
  • Ne mélange pas mise en page en CSS et des éléments de formattage html (style des <table> à seules fin de mise en forme, des height=, style="..", etc.) : c'est le meilleur moyen d'avoir des problèmes (et des différences entre navigateurs).
  • Pour tes textes alternatifs des images, ils doivent pouvoir remplacer le contenu : un texte alternatif vide sur ton image de titre n'est probablement pas une bonne solution. Mets-y plutôt ce que tu peux lire : "Tsunami". Aveugles et moteurs de recherche sauront apprécier ;-)
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.12) Gecko/20080207 Firefox/7.10 Firefox/2.0.0.12
Vrony
Arias
Messages : 3
Inscription : 21 mars 2008, 12:24

Message par Vrony »

Merci encore pour ces infos, je m'y mettrai demain.
Hum... les propriétés clear... cela n'évoque en moi qu'une grande angoisse, je ne sais pas ce que c'est. Verrai demain aussi
Par contre, étant donné que mon site est basé sur un triste mélange CSS + <table>... cela signifie -t'il que je dois tout revoir ?

NB:pour le ALT non renseigné, c'était simplement histoire de débugger vite fait. Je compte effectivement suivre vos conseils avisés, dès que j'aurai réglé cette histoire !

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.12) Gecko/20080201 Firefox/2.0.0.12
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités