RESOLU : Mon site deconne sur IE :(

Je bosse mnt depuis 2 mois sur un site et je me rends compte que le design foire complètement sur Internet Explorer !

En effet, j'ai mozilla et le design est tout a fait comme je le vx mais pas sur IE

Avez vous une idée comment résoudre ce (gros) problème

=> Mon site : http://www.csstournaments.0fees.net

Message édité par unamed_ le 05-09-2009 à 09:17:36

------------------------------ - Site de tournois css => http://www.csstournaments.0fees.net

Répondre

Inscrivez-vous ou connectez-vous pour masquer ceci.

Le site ne répond pas. Tes 2 sites d'ailleurs.

Répondre à SiM07

Y'a énormément de choses à changer:
- #corp { width: 740px; }
- .entete H1 { margin-bottom:0px; }
- le <br> juste au dessus de ton #pied, met lui un {clear:both;} aussi
- #tab a { height:25px; }

etc...

Puis oublie pas de corriger les "photes" d'orthographe aussi... un vrai massacre de la langue française ton site.

Message édité par OmaR le 27-08-2009 à 00:43:48

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

Mon code CSS ne serait donc pas approprié pour IE ?

------------------------------ - Site de tournois css => http://www.csstournaments.0fees.net

Répondre à unamed_

bah, il faut ajouter quelques trucs pour que ça fonctionne sur les deux...

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

Le problème ... c'est que je ne sais pas quoi

Tu as commencé à faire une liste

C'est tout ou il y a encore beaucoup ?

------------------------------ - Site de tournois css => http://www.csstournaments.0fees.net

Répondre à unamed_

Bah commence déjà à ajouter ce que je t'ai mis, tu vas bien voir ce que ça donne, et tu verras qu'il faudra encore en modifier un peu.
Je n'ai pas pris le temps de tout lister, ça serait assez long.

Un truc à faire en premier quand on fait un design, c'est de mettre ça sur la première ligne de son CSS :
* { margin:0; padding:0; }

Du coup, tous les navigateurs prennent les mêmes marges et padding pour tous les éléments, ça permet de partir sur des bonnes bases. Après, c'est plus simple d'arranger les éléments de telle manière que ça fonctionne sur tous les navigateurs.

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

Bonsoir,

Tu devrais peut être par la même occasion enlever tes plus de 70 erreurs au validateur W3C ça éviterais déjà je pense pas mal de soucis niveau interprétation des navigateurs,

Ensuite il faut un peu s'y connaitre en CSS et vérifié bloc après bloc la réaction IE / FF, changer les positions des block (relative, absolute) regarder si les largeurs et hauteurs sont bien spécifiés etc etc. Je te propose de revoir ton code CSS =)

Bonne chance pour la suite n'hésite pas a poster tes problèmes CSS

Message édité par cyberboss54 le 03-09-2009 à 22:08:30

------------------------------ Age : 19 ans
Profession :
- Développeur web (dans une société) - Etudiant (bac+2 dev web) - Auto-entrepreneur (web-develop54), site internet : http://www.web-develop54.fr/
Répondre à cyberboss54

Merci beaucoup
Je ne suis qu'un amateur et donc je n'ai pas poussé loin l'apprentissage du CSS.
Vous n'avez pas un lien pour apprendre le css plus profondément?
Je remarque que les fonds transparents des images apparaissent en blanc, comment arranger ça ?
Encore merci de vous attarder sur mon problème

Message édité par unamed_ le 04-09-2009 à 17:03:14

------------------------------ - Site de tournois css => http://www.csstournaments.0fees.net

Répondre à unamed_

Pour les png IE6 ne gère pas la transparence il faut donc lui affecté une sorte de "png fix" qui consiste a appliquer un filter (voir google) (sa ressemble a ça :

Code :

background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png',sizingMethod='crop');

) sur la feuille de style pour IE. Tu a aussi cet article (en anglais) qui est pas mal : http://www.komodomedia.com/blog/20 [...] ix-for-ie/

Pour le CSS si tu veux les bases de structuration d'un site : http://siteduzero.com partie HTML/CSS

Puis tu as un bonne référence en matière de CSS : http://alsacreations.com

Tu devrait y trouver ton bonheur ^^

Bonne chance pour la suite

PS : par rapport a omar tu a raison j'ajouterai meme :

Code :

* { margin:0; padding:0; border: 0; text-decoration: none; }
img { display: block; } /* Car généralement les images que l'ont utilises dovent se comporter comme des blocks c'est aussi sources de bug d'oublier de mettre des images en block */

Message édité par cyberboss54 le 04-09-2009 à 18:29:31

------------------------------ Age : 19 ans
Profession :
- Développeur web (dans une société) - Etudiant (bac+2 dev web) - Auto-entrepreneur (web-develop54), site internet : http://www.web-develop54.fr/
Répondre à cyberboss54

Ah non, perso je trouve totalement con de faire img { display:block; } !

Sinon il y a les CSS de Reset donc celle faisant partie de YUI (Yahoo User Interface)

Message cité 1 fois

Répondre à SiM07

SiM07 a écrit :

Ah non, perso je trouve totalement con de faire img { display:block; } !

Sinon il y a les CSS de Reset donc celle faisant partie de YUI (Yahoo User Interface)

Une petite explication alors ?

Un comportement inline sur une image peut devenir gênant sous certaine conditions.

Message édité par cyberboss54 le 04-09-2009 à 19:31:51

------------------------------ Age : 19 ans
Profession :
- Développeur web (dans une société) - Etudiant (bac+2 dev web) - Auto-entrepreneur (web-develop54), site internet : http://www.web-develop54.fr/
Répondre à cyberboss54

Oui c'est gênant, reste que c'est le comportement normal et l'appliquer sur l'ensemble peut s'avérer problématique. Ce qui va être incohérent c'est qu'ensuite dans ton code tu vas te retrouver a mettre des img en display:inline ... c'est le monde à l'envers !

Message cité 1 fois

Répondre à SiM07

SiM07 a écrit :

Oui c'est gênant, reste que c'est le comportement normal et l'appliquer sur l'ensemble peut s'avérer problématique. Ce qui va être incohérent c'est qu'ensuite dans ton code tu vas te retrouver a mettre des img en display:inline ... c'est le monde à l'envers !

Je suis d'accord ça peux paraître paradoxale mais en tout cas il y a énormément de cas ou l'image doit se comporter comme un block, après sa dépend du style de site que tu fait moi je sais que sur Blédina ou encore Etam ou encore cine cinema d'accord j'utilise pas img { display: block; } mais le nombre de cas ou j'en besoin en justifierai l'utilité ...

------------------------------ Age : 19 ans
Profession :
- Développeur web (dans une société) - Etudiant (bac+2 dev web) - Auto-entrepreneur (web-develop54), site internet : http://www.web-develop54.fr/
Répondre à cyberboss54

Perso, ce qui est design dans ce genre je passe les 99% du temps dans un bloc avec la bonne largeur et hauteur avec l'image en background histoire de garder mon code xHTML propre.

Message cité 1 fois

Répondre à SiM07

SiM07 a écrit :

Perso, ce qui est design dans ce genre je passe les 99% du temps dans un bloc avec la bonne largeur et hauteur avec l'image en background histoire de garder mon code xHTML propre.

ça se justifie

------------------------------ Age : 19 ans
Profession :
- Développeur web (dans une société) - Etudiant (bac+2 dev web) - Auto-entrepreneur (web-develop54), site internet : http://www.web-develop54.fr/
Répondre à cyberboss54

J'ai résolu les problèmes les plus gênants en local
Il n'y a plus qu'à le remettre à jour en ligne

Encore merci de votre aide

------------------------------ - Site de tournois css => http://www.csstournaments.0fees.net

Répondre à unamed_

RESOLU : Mon site deconne sur IE :(

Forum Programmation : RESOLU : Mon site deconne sur IE :(