28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je rencontre un problème très bizarre sur un de mes sites : http://emassist.fr

J'ai construit ce site en me basant sur mes versions installées :

IE 7
Mozilla 3

Le rendu est impeccable

Puis je l'ai testé sur différents navigateurs grâce à http://browsershots.org/. Pas de problèmes non plus...

Voici quelques captures écran de comment il s'affiche sur plusieurs PC portables, sous Vista et IE 7...
upload/16530-vsj49A1.tm.jpg

J'y perd mon latin et mes cheveux !

Est-ce que quelqu'un a déjà rencontré ce problème ? D'où est-ce que ça peut venir ?

D'avance merci de vos lumières !

Sandra
Modifié par ASGlobalServices (04 May 2009 - 14:19)
Qu'est-ce qui ne va pas ? Le fait que ce ne soit pas centré ?

Sur mon portable, Vista 64-bits, IE7 me semble l'afficher correctement ...

upload/4569-emassistie7.jpg
Bonjour,

Oui, le fait que ce ne soit pas centré, et aussi le fait que certains DIV sont espacés : entete, menu, slogan, contenu. Et aussi le bandeau droite qui disparait carrément...

Ton portable affiche bien le site tel qu'il a été créé Smiley cligne ... Un rapport avec le Vista 64-bits peut-être ?

Merci !

Sandra
Entre temps, j'ai changé de portable Smiley cligne et le résultat est identique sous IE7/XP.

Par contre, toujours sous IE7/XP, c'est juste ta page 404 qui ne marche pas bien sous IE7... (pas sous FF)
Merci,

Si c'est qu'une page, le problème est beaucoup moins grave alors ? non ? Mais je ne vois toujours pas d'où peut provenir le problème...

Pourtant toutes les pages sont parties du même gabarit "validé" sur les différentes versions / plateformes... Smiley bawling

Merci

Sandra
Hello,

ASGlobalServices a écrit :
Mais je ne vois toujours pas d'où peut provenir le problème...
Sur ta page 404 tu as un commentaire avant le doctype qui fait basculer les navigateurs en mode quirks... c'est peut-être une piste. Smiley cligne
Bonjour,

Le début du code de la page 404:
	<!-- Attention, ne pas d&eacute;placer ou mettre le script ci-dessus en include -->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Un commentaire HTML placé avant le Doctype fera passer IE6 en mode Quirks (et le centrage avec les marges automatiques ne fonctionne pas en mode Quirks). Il me semblait que ce n'était pas le cas avec IE7, mais peut-être que si.

Auquel cas, le passage en mode Quirks peut expliquer un certain nombre de problèmes de rendu.
Bonjour,

Ahhhhh ok... Comme quoi on apprend tous les jours...

Effectivement j'ai placé un commentaire ici parce qu'il y a un script php juste au-dessus... Au cas où le destinataire du site aurait l'idée de placer ce script en include...

Donc je retire ce commentaire et lui envoie le fichier corrigé... Rassurez-moi : je peux laisser le script (il récupère des infos sur l'url de la page demandé, url de provenance... et envoie le tout par mail... ) ?

Je vous tiendrais informé dès qu'elle transfère la page corrigée sur son site.

Grand merci en tout cas !!!

Sandra

Un jour où je n'ai rien appris est un jour perdu...
Modifié par ASGlobalServices (04 May 2009 - 17:20)
Florent V. a écrit :
Un commentaire HTML placé avant le Doctype fera passer IE6 en mode Quirks [...]. Il me semblait que ce n'était pas le cas avec IE7, mais peut-être que si.
D'après cet article c'est bien le cas.


Edit: en fait c'est pas si sûr puisqu'il ne parle que du HTML 4.01


Edit2: en tout cas si on utilise le code JavaScript proposé
javascript:alert(document.compatMode)
sur la page 404 on obtient BackCompat alors que sur une autre page on obtient CSS1Compat


Edit3: @Sandra > à tout hasard, si tu souhaites avoir une citation en signature tu peux le faire en allant dans ton profil. Smiley smile
Modifié par Heyoan (04 May 2009 - 17:37)
ASGlobalServices a écrit :
Rassurez-moi : je peux laisser le script (il récupère des infos sur l'url de la page demandé, url de provenance... et envoie le tout par mail... ) ?

Tant qu'il ne génère rien dans la page, oui. Tu peux aussi placer ton commentaire en PHP plutôt qu'en HTML.
Bonjour,

Le rapport suite à votre aide d'hier (encore un grand merci !) :

Le problème semble résolu mais par contre il y a un problème de taille de caractères sous IE mais toujours sur certains PC, pas sur ma version ni sur les screenshots...

je n'arrive pas à mettre les images (?), vous pouvez les voir ici :
Image 1
Image 2
Image 3

J'ai fixé les tailles en em... peut-être que c'est ça ?

Merci de votre aide,

Sandra
Modifié par ASGlobalServices (05 May 2009 - 10:32)
Moi j'ai remarqué des variabilitées entre le meme navigateur et meme version mais différent pc.
Ce que j'ai remarqué c'est les utilitaires installer ou plugin pour c'est navigateurs.
j'ai un problème similaire une fois j'ai du désinstaller un utilitaire pour que mon affiche revienne a la normal.
Heu..... j'ai modifié une ligne de mon css, celle-là :


/* Base.css - Source alsacréations */

/* --- STYLES DE BASE POUR LE TEXTE ET LES PRINCIPAUX ÉLÉMENTS --- */

/* Page */
html {
	font-size: 100%; /* Voir -> Note 1 à la fin de la feuille de styles. */
}


Modifiée donc comme ça :

/* Base.css - Source alsacréations */

/* --- STYLES DE BASE POUR LE TEXTE ET LES PRINCIPAUX ÉLÉMENTS --- */

/* Page */
html {
	font-size: 16px !important; /* Voir -> Note 1 à la fin de la feuille de styles. */
}


Et ça marche !!!

J'aurais d'autres retours des "visiteurs buggeurs" plus tard mais déjà ça marche...

Merci

Sandra
Malheureusement, la solution que tu as trouvée risque de proser des problèmes bien plus grave à certains visiteurs.

Lorsque les tailles de polices sont précisées en unité fixe (px), Internet Explorer 6 et 7 (qui sont majoritaires sur la toile) ne peuvent plus augmenter la taille des caractères lorsque l'utilisateur le souhaite (Affichage -> Taille du Texte). Du coup, les gens qui, comme moi et beaucoup d'autre, ont une mauvaise vue (ou simplement une migraine) et DOIVENT aggrandir la taille des caractères pour pouvoir lire correctement et facilement (c'est fatiguant de lire sur écran), ne le peuvent plus.

Ton problème, viens plus certainement d'un problème dans les autres spécification de taille de caractères plutôt que dans celle de html (dont toute les autres définition CSS héritent).
Bonjour,

Oui ça m'ennuie beaucoup. Je ne suis pas une pro. de l'accessibilité mais je m'y met doucement. En attendant, j'essaie de faire un minimum.

C'est uniquement sur "html" que j'ai spécifié 16px au lieu de 100%. Le reste des tailles est en .em

Qu'est-ce que tu en penses ? Je ne vois pas trop comment régler ce problème autrement... Smiley ohwell

Merci

Sandra
Bonjour,

Je dirais que les utilisateurs qui ont vu du texte trop gros sur les pages ont simplement configuré leur navigateur (Internet Explorer) pour afficher le texte avec la taille «Plus grande» ou «La plus grande». S'ils reviennent à normal, l'affichage sera proche du rendu attendu. S'ils utilisent «Plus grande» ou «La plus grande», ils auront un texte plus grand car c'est ce qui est demandé.

Ce n'est qu'une supposition, mais j'ai déjà rencontré ce cas de figure. Comme beaucoup de sites figent la taille du texte en pixels, ces utilisateurs qui savent mal utiliser leur navigateur ne rencontrent ce problème que sur certains sites.
ASGlobalServices a écrit :
C'est uniquement sur "html" que j'ai spécifié 16px au lieu de 100%. Le reste des tailles est en .em

Ce qui bloque complètement la fonctionnalité de redimensionnement du texte par le navigateur, à la source. À éviter.
Bonjour,

Non Florent, nous avons vérifié la taille d'affichage des navigateurs (tous IE pour rappel) : ils étaient tout en affichage Normal...

Pour revenir à la question de l'Accessibilité, ayant moi-même des frères malvoyants, ça ne me convient pas non plus. Je continue bien évidemment de chercher une solution accessible mais moi-même sur mon écran/PC/IE je n'ai pas ce problème, donc pas évident de faire les tests nécessaires.

Si vous avez une solution je suis preneuse, d'autant que j'ai d'autres sites à développer... Smiley confus

Merci,

Sandra
Modifié par ASGlobalServices (06 May 2009 - 08:49)
Bonjour,

Je reviens vers vous toujours pour ce même sujet de l'accessibilité.

Le problème étant provisoirement réglé grâce au "html: 16px!important;" je ne voudrais pas pour autant laisser comme ça et que le provisoire devienne définitif.

Est-ce que quelqu'un aurait la gentillesse de fouiller mes feuilles de style Base.css et Style.css pour voir où ça cloche. Parce que moi non seulement j'ai trop le nez dedans donc je n'y vois plus rien, mais en plus je n'ai pas du tout ce bug à l'écran....

Merci d'avance,

Sandra
Modifié par ASGlobalServices (07 May 2009 - 11:13)