Probleme d'affiche avec IE

[destroyedlolo]

Bonjour,

Sur la page suivante,

http://destroyedlolo.hd.free.fr/test/

j'ai regroupe les differents problemes auquel je fais face avec IE. Elle fonctionne tres bien avec FireFox.

1/ Le menu sur ce site.

J'utilise une <ul> pour creer la liste des liens que je met en forme avec du CSS.

Avec IE, les liens sont decalles sur la gauche.

2/ du texte sur les bouton

IE ne gerant pas les <button> correctement, j'ai creer des <input type=submit> auxquels sont associes des images par CSS.

Tous se passe bien avec FF, mais avec IE, le text du value ce superpose aux images.

3/ En bas de la page, j'ai mis un <hr> habille par une image avec des yeux par CSS.

Mais pourquoi IE encadre-t-il cette image ?

4/ Enfin mon probleme d'URL avec des accents.

Sous IE, l'image est casse tout comme le lien. Pourquoi ? Parce qu'IE, au lieu de conserver le 'é' normal, il l'encode en UNICODE ... l'URL ne correspond plus.

Voila, comment solutionnez vous ce genre de probleme ?

Merci

Modifié 24 Janvier 2007 par destroyedlolo

[baulet]

bonjour,

1/ essaye margin=Hpx Dpx Bpx Gpx; H=haut, D=droit, B=bas, G=gauche

tu n'a défini que margin-top, je crois qu'il faut forcer les valeurs margin sinon elles dépendent du style intégré au navigateur...

2/ aucune idée

3/ le hr avec ie est problématique, ie ajoute des marges même quand tu imposes margin: 0px

donc tu contruis ton hr avec une <img>, seule solution que j'ai trouvée.

4/ à mon avis, c'est une mauvaise idée de mettre des caractères spéciaux dans les url...

mais tu peux essayer d'encoder ta page en utf8 et ajouter une meta charset=utf-8

[karnabal]

Salut

3/ En bas de la page, j'ai mis un <hr>[/b> habille par une image avec des yeux par CSS.

Mais pourquoi IE encadre-t-il cette image ?

Je t'aurai bien conseillé un border:none. Si la solution ne se trouve pas là tu peux jetter un coup d'oeil sur les liens qui te seront proposé à partir de cette page et qui t'en diront plus sur la façon de styler la balise <hr> sous IE .

Voila, comment solutionnez vous ce genre de probleme ?

D'une façon générale tu peux t'affranchir des différences d'interprétation des navigateurs en ayant recours aux commentaires conditionnels.

[ghost]

Bonjour,

Sans vouloir te vexer, je trouve que FF est bien gentil d'executer ton code !!

Déjà, utilise des doubles quotes pour le html c'est mieux, ensuite corrige toutes les erreurs du style <ul class=liens> par <ul class="lien"> et <hr class='invisible separateur'> par <hr class="invisible_separateur"> et peut être ta feuille de style sera interpretée (à sa lecture j'ai un petit doute).

Et pourquoi ces boutons de formulaire ?

Franchement (et on est tous passé par là) je te conseille de revoir les bases du html et du css, sur le site du zero (-http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html) où sur alsacreations (-http://forum.alsacreations.com/forum.php).

Bon courage

[destroyedlolo]

Bonjour ghost,

Sans vouloir te vexer, je trouve que FF est bien gentil d'executer ton code !!

Déjà, utilise des doubles quotes pour le html c'est mieux,

Ben, l'utilisation des simples comme des doubles cotes sont autorises pour delimiter les chaines comme indique dans les spec W3C

ensuite corrige toutes les erreurs du style <ul class=liens> par <ul class="lien"> et <hr class='invisible separateur'> par <hr class="invisible_separateur"> et peut être ta feuille de style sera interpretée (à sa lecture j'ai un petit doute).

Oui, mais la, c'est que tu n'as pas compris mon code : Je n'ai pas de classe qui se nomme invisible separateur mais 2 classes distinctes qui se nomment invisible (qui rend la balise ... invisible ) et une seconde nomme separateur qui fait que rien ne peut s'afficher a droite comme a gauche.

En clair et en decode, le <hr> en question herite a la fois de l'invisibilite et est un separateur (heritage multiple comme le prevoit le CSS).

Et pourquoi ces boutons de formulaire ?

??? Heu, ben car j'en ait besoin

Sur cette page de teste, ils ne sont la que comme exemple des problemes d'affichage mais dans l'interface d'admin reele, ils servent a tourner ou a effacer une image.

Par quoi veux-tu que je les remplace ?

Franchement (et on est tous passé par là) je te conseille de revoir les bases du html et du css, sur le site du zero (-http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html) où sur alsacreations (-http://forum.alsacreations.com/forum.php).

Hormis le probleme des attributs uniques non cote, le reste du code est tout ce qu'il y a de plus correcte. C'est juste que IE en fait a ca tete (genre les bordures des <hr> ou le texte des boutons qui n'ont strictement aucune raison d'apparaitre.)

Bon courage

Merci A+

Lolo

[destroyedlolo]

bonjour,

1/ essaye margin=Hpx Dpx Bpx Gpx; H=haut, D=droit, B=bas, G=gauche

tu n'a défini que margin-top, je crois qu'il faut forcer les valeurs margin sinon elles dépendent du style intégré au navigateur...

Ok, pile poile : ca marche

3/ le hr avec ie est problématique, ie ajoute des marges même quand tu imposes margin: 0px

donc tu contruis ton hr avec une <img>, seule solution que j'ai trouvée.

Bon, ben tant pis : je reste avec les <hr> : ce n'est qu'un probleme cosmetique pas grave.

4/ à mon avis, c'est une mauvaise idée de mettre des caractères spéciaux dans les url...

mais tu peux essayer d'encoder ta page en utf8 et ajouter une meta charset=utf-8

J'ai ajouter une fonction qui transforme les accents en caractere non accentue, c'est sans doute plus sur.

Le truc ... bizarre, c'est qu'elle fonctionne Je veux dire que ce qui arrive par un formulaire est bien encode ASCII, ce n'est que sur les URL que IE les transforme en Unicode

N'importe quoi ! Ce truc n'est meme pas capable d'avoir la meme strategie tout le long de l'interpretation d'une page

Merci en tout cas pour tes idees.

Lolo