28173 sujets

CSS et mise en forme, CSS3

bonjour
Après avoir fait quelques recherches sur les anciens post je me lance car visiblement mon probleme n'a pas été evoqué :
Si vous allez sur cette page : http://www.petochon.fr/course/test/carte_record.htm avec firefox vous verrez que l'on peux scroller la carte alors qu'avec IE6 ça ne marche pas !!!

j'ai fait pas mal de test au niveau de l'overflow mais rien n'y fait !!!
si quelqu'un a une idée sur ce probleme : merci d'avance
Modifié par yethi (25 Feb 2007 - 15:17)
Bonjour,

Dans ce type de page, éviter de toutes façons le scroll "intérieur", et privilégier le scroll "fenêtre du navigateur", plus accessible et plus ergonomique.

(Devoir faire joujou avec 4 barres de scroll pour constater qu'une partie du contenu est rogné et non accessible dans FF est assez agaçant Smiley ravi )
Modifié par Laurent Denis (18 Feb 2007 - 09:59)
bonjour

oui evidement cette solution vas fonctionner mais je voulais que mon bas de page soit fixe....
De toute maniere il doit bien y avoir une technique propre pour que ca soit ok
salut
Ne pas utiliser les overflow pour ce genre de chose, mais uniquement, si on tient absolument à avoir des éléments fixes (on y tient souvent pour de bien mauvaises raisons et sans argument pertinent, mais passons...), le positionnement fixe.
position: fixed;

Implémenté dans IE7, mais pas dans IE6. Pour IE6, on passera par des commentaires conditionnels, pour basculer vers un bête positionnement absolu ou statique.
bonjour à tous

Avec vos indication et apres quelques heures de boulot j'ai enfin obtenu la page telle que le souhaitait : j'ai suprimé la relation pas un nombre entre les éléments de la carte et ceux de la liste en privilegiant une relation visuelle.

Merci de me dire ce que vous en pensez sur http://www.petochon.fr/course/test/carte_record_ff.htm

Par contre il y a un problème car l'afficharge est correct uniquement avec firefox !!! bien évidement IE pose des pb : decalage des rectangles sur la liste et apparition des ronds derriere la carte !!!
(passez sur "A determiner")
Quelqun pourrais t-il me dire comment faire pour que tous les explo reagissent pareil ?????
Merci par avance
La seule page que je trouve est celle-ci :
http://www.petochon.fr/course/test/carte_record.htm

Elle utilise la technique de hauteur fixe + overflow pour obtenir une barre de défilement interne, et une liste avec des éléments positionnés en CSS sur une carte pour faire une carte réactive. Bref, tout ce qu'il ne faut pas faire.

Ne pas utiliser la technique peu robuste et très peu satisfaisante de l'overflow, éviter autant que possible les barres de défilement internes, utiliser le positionnement fixe comme dit ci-dessus, et enfin utiliser une image map : voir la spécification HTML 4 à ce sujet. Ne pas oublier de renseigner les attributs alt pour chaque élément area de la map.
bonjour

je ne vais pas renoncer si près du but au CSS pour revenir à du AREA+MAP !!!
J'avais fais quelques test au début mais je CSS me parrait + simple

Pour ce qui est de l'OVERFLOW je vais effectivement revenir a du + classique, mais j'avais choisit cette option pour avoir un bas de page fixe. un peu comme avec les frames (que j'ai aussi abandonné pour le CSS)

Le probleme initial de décalage entre IE et FF est résolu....

Reste donc le robleme de cercle de repere qui apparait derriere la carte

Qui à une une idée ?????

http://www.petochon.fr/course/test/carte_record.htm

merci
yethi a écrit :
je ne vais pas renoncer si près du but au CSS pour revenir à du AREA+MAP !!!

Les area + map sont faites pour ce type d'utilisation, et sont accessibles.
L'utilisation de CSS pour réaliser une image map pose des problèmes d'accessibilité, et relève de la bidouille, les CSS n'étant pas faites pour ça (en particulier : pas faites pour générer une information de contenu telle que le positionnement d'une ville sur une carte).

Donc oui, je suggère de revenir à area + map.

Attention à ne pas sombrer dans la CSSite aigüe.

yethi a écrit :
Pour ce qui est de l'OVERFLOW je vais effectivement revenir a du + classique, mais j'avais choisit cette option pour avoir un bas de page fixe.

Le positionnement fixe sera obtenu en CSS avec position: fixed, à dégrader pour IE6 (via commentaires conditionnels) en position: absolute ou position: static (positionnement normal, en flux), suivant le cas.