Probleme de CSS avec IE
blacklemming
Messages postés
3
Statut
Membre
-
thifoolish Messages postés 79 Statut Membre -
thifoolish Messages postés 79 Statut Membre -
J'ai créé un mini jeu en ligne, genre baston HTML de goblins, seulement sous Internet Explorer l'affichage est tout déformé.
Le jeu se présente sous forme d'une grille où l'on peut se déplacer, et sur cette grille il y a des <DIV> superposés en "position:relative" avec un "z-index", le Hic c'est que dans ces DIV il y a des images parfois plus grandes que les cases, et sous Internet Explorer, les cases <TD> sont agrandies à la taille des images contenues dans les <DIV> pourtant "détachés".
Je précise que sous Firefox ça marche très bien, grrr une idée ? j'ai temporairement mis en surbrillance les cellules du tableau, pour faciliter le diagnostic :
http://t4c.abominationt4c.com/index.php?p=Gobwars
Merci de votre aide si vous avez une idée !
Le jeu se présente sous forme d'une grille où l'on peut se déplacer, et sur cette grille il y a des <DIV> superposés en "position:relative" avec un "z-index", le Hic c'est que dans ces DIV il y a des images parfois plus grandes que les cases, et sous Internet Explorer, les cases <TD> sont agrandies à la taille des images contenues dans les <DIV> pourtant "détachés".
Je précise que sous Firefox ça marche très bien, grrr une idée ? j'ai temporairement mis en surbrillance les cellules du tableau, pour faciliter le diagnostic :
http://t4c.abominationt4c.com/index.php?p=Gobwars
Merci de votre aide si vous avez une idée !
A voir également:
- Probleme de CSS avec IE
- Ie tab - Télécharger - Outils pour navigateurs
- Ie 11 - Télécharger - Navigateurs
- Ie 9 - Télécharger - Navigateurs
- Ie 8 - Télécharger - Navigateurs
- Google payment ie ltd dublin c'est quoi - Forum Consommation & Internet
8 réponses
Hello!
Joli ton jeu ^^
Bon le code source est un peu bordélique à l'affichage par contre, pas d'alinea, donc pas facile à déboguer...
Ca ne résoudra pas ton problème, mais tu as oublié des guillemets à:
Joli ton jeu ^^
Bon le code source est un peu bordélique à l'affichage par contre, pas d'alinea, donc pas facile à déboguer...
Ca ne résoudra pas ton problème, mais tu as oublié des guillemets à:
<table width="792" border=0 cellpadding=0 cellspacing=0>et à:
<table class=mainmenu cellpadding=0 cellspacing=0> <tr height=26>et aussi:
<img src=gobwars3/pics/tree.gif >
salut,
et avec css pour éviter le dépassement ?
si tes '<td>' ont une taille fixe essaie d'ajouter :
et avec css pour éviter le dépassement ?
si tes '<td>' ont une taille fixe essaie d'ajouter :
td
{
overflow: hidden;
}
J'ai ajouté des sauts de lignes dans le code HTML histoire que ce soit plus lisible, j'ai aussi ajouté les double-quotes qui manquaient, merci de ton aide, si tu as d'autres pistes je suis toujours preneur :p
C'est beaucoup mieux le code source aéré ^^
J'ai l'impression que ça déconne à cause de l'image "tree" ; en fait les lignes qui sont plus hautes sont celles qui l'incluent. Cette image fait 180*200 px et tu la mets telle quelle dans une cellule de largeur 100px... essaye d'ajouter un attribut width="100" dans la balise <img>:
J'ai l'impression que ça déconne à cause de l'image "tree" ; en fait les lignes qui sont plus hautes sont celles qui l'incluent. Cette image fait 180*200 px et tu la mets telle quelle dans une cellule de largeur 100px... essaye d'ajouter un attribut width="100" dans la balise <img>:
<img width="100" src="gobwars3/pics/tree.gif">pour voir si ça change qqch.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
En "overflow :auto" sur les TD ca change rien par contre en "overflow : auto" sur les DIV ca me cache le contenu..
L'idée c'est de pouvoir placer dans une case de 100x100 pixels une image qui en fait 180x180 sans pour autant agrandir la case de 100x100, je veux pas le faire en positionnement absolute, car c'est trop la merde à faire
L'idée c'est de pouvoir placer dans une case de 100x100 pixels une image qui en fait 180x180 sans pour autant agrandir la case de 100x100, je veux pas le faire en positionnement absolute, car c'est trop la merde à faire
tu as besoin absolument besoin de la balise '<img />' ?
tu pourrais mettre l'image en image de fond du '<td>', comme ça pas de déformation.
tu pourrais mettre l'image en image de fond du '<td>', comme ça pas de déformation.
en fait, il faudrait commencer par nettoyer et ranger le html.
dans la séquence suivante il y a déjà des incohérences. '<table>' directement dans '<table>', '<th>' dans '<tr>'.
les styles sont codés en html ou embarqués ce qui ajoute à la complexité du code.
en plus tu n'as pas de DocType.
donc le rendu dans les navigateurs est forcement imprévisible et le débogage très difficile.
dans la séquence suivante il y a déjà des incohérences. '<table>' directement dans '<table>', '<th>' dans '<tr>'.
les styles sont codés en html ou embarqués ce qui ajoute à la complexité du code.
en plus tu n'as pas de DocType.
donc le rendu dans les navigateurs est forcement imprévisible et le débogage très difficile.
<td width="11"> <img width="11" src="img/v3/tabright_off.gif"> </td> </tr> <table class=maintab> <tr> <td> <center> <font color=white>Come on ! Join the battle ! Login the website, and click Gobwars tab !</font> <br> <font color=white> <table class="outertable" width="600" cellpadding="0" cellspacing="0"> <tr bgcolor="DD3333"> <th colspan="3"> <font color="#FFFFFF">Current scoring (kills/breed)</font> </th> </tr>
Bonjour,
Juste une information pour améliorer grandement la compatibilité avec les anciens navigateurs, il faut utiliser les css de cette manière :
.maClasse {
width:100px;
}
c'est-à-dire sans espace entre l'attribut css et sa valeur...
Le rendu d'Internet Explorer sera peut-être meilleur... en tout cas dans ses anciennes versions c'est une certitude.
Au revoir.
Juste une information pour améliorer grandement la compatibilité avec les anciens navigateurs, il faut utiliser les css de cette manière :
.maClasse {
width:100px;
}
c'est-à-dire sans espace entre l'attribut css et sa valeur...
Le rendu d'Internet Explorer sera peut-être meilleur... en tout cas dans ses anciennes versions c'est une certitude.
Au revoir.
