probleme affichage internet explorer

probleme affichage internet explorer - HTML/CSS - Programmation

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>

Reply

Marsh Posté le 08-10-2011 à 22:01:47   

Reply

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 !


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed