probleme affichage internet explorer - HTML/CSS - Programmation
Marsh Posté le 09-10-2011 à 14:40:34
Deux solutions (Pas les meilleurs, les plus simples qui ça marchent)
1 - Supprimer height="100%" à l'image sans_cadre.jpg
2 - Ajouter height="100%" à <table>
Le problème est le suivant :
Comment le navigateur va-t-il déterminer la taille des objets.
Quand tu dis 100%, cela signifie 100% de la hauteur/largeur disponible dans le conteneur parent.
Le conteneur parent de l'image est <td>. Sa hauteur est déterminée par ce qu'elle contient, et elle ne contient rien de très haut, sauf l'image.
C'est là que l'interprétation des navigateurs entre en jeux, car tes indications de mises en pages ne sont pas assez précises et donc sujettes à interprétation.
Il ne faut jamais laisser le choix au navigateur, et donc avoir une mise en page très précise.
Bienvenu dans un mode de fous !
Marsh Posté le 08-10-2011 à 22:01:47
Bonjour,
je suis en train de me frotter à l'écriture html, j'ai pondu quelques lignes qui fonctionnent bien avec firefox et chrome, mais pas avec IE 9 ... quelqu'un aurait une idée ? merci !
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>duo Philéas</title>
<style type="text/css">
img {border : none; }
.sansbordure {border: 0; /* ne mets pas de bordure */}
.bordure{border: 1px solid black; /* crée une bordure de 1 px noir */}
.table {border-collapse: collapse; /* Colle les bordures entre elles */}
</style>
</head>
</head>
<body
style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);
alink="#000099" link="#000099" vlink="#990099">
<table width="100%" bgcolor="black" border="1" bordercolor="black">
<tr><td rowspan="13" width="85%" ><img src="http://duophileas.free.fr/images/sans_cadre.jpg" width="100%" height="100%" border="0" align="top"> </td></td></tr>
<tr><td class="sansbordure">.</td></tr>
<tr><td class="sansbordure" align=center><a href = "http://aaatchoummm.free.fr/phileas/bouton_d_or.jpg"><img src=http://duophileas.free.fr/boutons/presentation.gif ></a></td></tr>
<tr><td class="sansbordure" align=center><a href = "http://aaatchoummm.free.fr/phileas/bouton_d_or.jpg"><img src=http://duophileas.free.fr/boutons/repertoire.gif ></a></td></tr>
<tr><td class="sansbordure" align=center><a href = "http://aaatchoummm.free.fr/phileas/bouton_d_or.jpg"><img src=http://duophileas.free.fr/boutons/actualites.gif ></a></td></tr>
<tr><td class="sansbordure" align=center><a href = "http://aaatchoummm.free.fr/phileas/bouton_d_or.jpg"><img src=http://duophileas.free.fr/boutons/ecouter.gif ></a></td></tr>
<tr><td class="sansbordure" align=center><a href = "http://aaatchoummm.free.fr/phileas/bouton_d_or.jpg"><img src=http://duophileas.free.fr/boutons/contact.gif ></a></td></tr>
<tr><td class="sansbordure">.</td></tr>
<tr><td class="sansbordure">.</td></tr>
<tr><td class="sansbordure">.</td></tr>
<tr><td class="sansbordure">.</td></tr>
</table>
</body>
</html>
<config>Windows Vista / Firefox 5.0.1</config>