Alignement vertical et IE MAC

Bonjour à tous,

Je me permets de vous contacter car j'ai un problème avec le
développement d'un site
(http://www.fefem.com/METS (ce n'est que le développement à cet endroit)). Sur ce site, je devrai "simplement"
aligner l'image principale (la magasin) contenant toute l'information (750x540)
sur la fenêtre du browser. J'ai utilisé pour cela l'idée proposée par alsacreations: http://www.alsacreations.com/articles/centrer/csscentrer.htm

Développant en FF et IE6 sur WXP, cela ne m'a pas posé de problème
mais notre Designer qui est sous MAC constate qu'avec IE, toute
l'image est basculé vers le haut. Et il en est de même pour la page
simplifié d'Alsacreations (Safari, FF, Mozilla sur Mac présente
l'image correctement).

Dès lors, chers développeurs CSS sous MAC, que dois-je coder pour
que la page simplifié d'Alsacréation par exemple, s'affiche
correctement au milieu de la page de manière verticale ?

Merci bcp pour votre info.

(Information transmise aussi sur la liste de diffusion des pompeurs)

Serge

C'est signalé dans le tuto d'Alsacréations ce problème... donc tu savais où tu allais. Tu peux aussi réfléchir à la pertinence du flottement vertical pour un site commercial comme le tien, quel intérêt ?
En 800x600 il s'affiche nickel, en 1024x768 (majorité) l'espace tournant gauche/bas/droite est équilibré et pas du tout gênant, au delà (je regarde sur un 1680x1050) cela n'apporte pas grand chose même si c'est un peu plus plaisant (le fond est noir...).
Mais si tu as la réponse tant mieux, reste que tu te pose un problème pour un navigateur obsolète installé sur un parc mineur (Mac OSx avec Safari sont de loin les plus utilisés sur Mac), as tu des infos sur les % de ce navigateur pour ce type de site ?

En fait, l'intérêt provient du fait que le site officiel (http://www.metsdelices.com/) a été proposé à différents concours de Design et que le concepteur Design qui est sous Mac préfère que celui-ci soit centré verticalement.

Et concernant l'intérêt de tenir compte d'IE, cela provient aussi de ses infos selon lesquelles la plupart de ses connaissances en matière de Design, utilise régulièrement encore IE sur MAC...

Bref, je pense que la solution que nous allons devoir utiliser sera la transformation en "table" même si je n'aime pas fonctionner ainsi...

Mais si d'autres propositions arrivent...
Modifié par FEFEM (29 Mar 2005 - 14:24)

Tu as le choix entre programmer une petite fonction javascript pour IE Mac qui va émuler le bon fonctionnement des marges négatives sur ce navigateur (pourquoi pas si c'est bien fait).

Ou adapter ce script (qui fonctionne trés bien) :

http://www.alistapart.com/articles/footers
http://www.alistapart.com/d/footers/footer_variation1.html

Ou laisser de coté la qualité de developpement au profit de l'aspect visuel en remplaçant tes blocks par des tableaux. Ce qui devrait en plus faire trés plaisir à tes amis designers sur Mac vu à quel point ils semblent rétrogrades.

Ou finalement laisser tomber toutes ces bidouilles et mettre en avant la qualité du developpement sans te soucier de ce minuscule pourcentages d'utilisateurs (0.2, 0.3%?) qui ont choisi d'utiliser un navigateur obsolète et dont le developpement s'est eteint il y a plus de 4 ans (une eternité en informatique) et qui, de fait, doivent s'attendre à ne pas pouvoir utiliser à leur plus haut potentiel les technologies récentes du développement Web.

PS: Je comprend trés bien le point de vue de certains utilisateurs professionnels, travaillant tous les jours avec un ordinateur, et qui ne peuvent consacrer 10 minutes au téléchargement et à l'installation d'un énorme (4 à 10Mo) logiciel trés compliqué (FireFox, Opera, safari...). Et puis ça va encore leur prendre plusieurs années pour se familiariser avec ces 5 icones en haut à gauche et ces 2 entrés de menu..) ahalala que c'est dur l'informatique parfois...
Modifié par jb_gfx (29 Mar 2005 - 15:19)

Heu... si je puis me permettre... ce professionel utilise FF et Safari en premier mais étant donné les visiteurs sur son site principal (> 300 visites/jour), il considère IE MAC non obsolète...

Enfin, merci bcp pour les infos très pertinentes et dans lesquelles je pense retrouver mon bonheur (ou plutôt celui du Designer )

Bonne journée !

Une astuce tout bète à laquelle je n'ai pas pensé en postant ma réponse...

Tu pourrais simplement utiliser des marges négatives pour centrer le conteneur horizontalement et verticalement sur tous les navigateurs et un simple hack pour centrer juste horizontalement sous IE Mac, en ajoutant une marge en haut sur ton conteneur l'effet pourrais être acceptable sous ce navigateur en conservant le centrage double sous les autres navigateurs.

Mise en oeuvre (tiré d'un site que j'ai réalisé et qui utilise cette astuce) :

body {
	background:#33064A;
	margin:0;
	padding:0;
	text-align:center; /* centrage IE5 Windows */
}

div#global { /* centrage horizontal + marge pour IE Mac */
	position: relative; /* pour Safari */
	text-align: left;
	margin: 10px auto 0 auto;
	width: 760px;
	height: 460px;
	background: #480A6B;
}

/* Masque le centrage par marges négatives IE5 version Mac \*/
div#global {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -380px;
	margin-top: -230px;
	width: 760px;
	height: 460px;
}
/* fin du hack IE5 version Mac */

Modifié par jb_gfx (29 Mar 2005 - 16:27)

FEFEM a écrit :
Ce professionel utilise FF et Safari en premier mais étant donné les visiteurs sur son site principal (> 300 visites/jour), il considère IE MAC non obsolète...

Il semble étrange pour un professionnel de se baser sur le trafic de son site perso pour évaluer les choix techniques pour un navigateur bien spécifique (et obsolète), je regarderais plutôt les résultats d'un site comparable à la cible visée, il m'étonnerais qu'un pourcentage "notable" de connexions soit faites à partir de iE Mac, mais bon, la solution avec 2 tables est rapide à faire est garantie un résultat 100 % efficace partout (mais pas dans les lois du seigneur actuel)... donc.

Finalement, j'ai opté pour la solution javascript mais bien que le site en développement soit validé en XHTML Strict 1.0 et que cela s'affiche correctement sous: IE Win, FF Win, Moz Mac, FF Mac et Saf Mac (excepté un petit problème d'alignement pour ce dernier), cela donne un résultat désastreux pour IE Mac avec des superpositions d'images, des alignements horizontaux qui ne se font pas.

Bref, nous en sommes en plein discussion pour savoir si nous devons tenir compte d'IE Mac...

Pour répondre à Momo, en fait, comme le site sera présenté à des Designers pour l'obtention de certains prix, notre Designer s'est basé sur la fréquence sur son site perso déjà fortement visité par ce genre de personne...

Le problème, c'est que je n'ai pas les moyens matériels de corriger les problèmes sous IE Mac et c'est là dessus que le boss doit prendre la décision.