Discussion :

[hedgehog]

Bonjour à tous,

Je rencontre un petit problème de compatibilité entre Firefox et IE.
J'ai créé un calque contenant un tableau, celui-ci est caché à l'affichage de la page, sous Firefox tout se passe bien, le calque et le tableau qu'il contient n'apparaissent pas. Par contre sous IE, tout se cache sauf certaines bordures du tableau

Voici des impressions d'écran (un dessin vaut mieux qu'un long discours) :

Sous Firefox (Rendu souhaité) :


Sous Internet Explorer (Mauvais rendu) :


Et voici les styles css utilisés :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
#calqueCalendrier {
	position:absolute;
	z-index:10;
}
 
body {
	font-family:Tahoma, Verdana, sans-serif;
	font-size:10px;
}
 
a:link,a:visited {
	color:#000000;
	text-decoration:none;
}
 
a:hover {
	color:#7A567A;
	text-decoration:none;
}
 
a:active {
	color:#E6CFE6;
	text-decoration:none;
}
 
table.calendrier {
	background-color:#C0CC8F;
	border:1px solid #788059;
	border-collapse:collapse;
}
 
tr.entete {
	background-color:#C0CC8F;
	font-weight:bold;
}
 
td.jour {
	background-color:#ACBF60;
	border:1px solid #788059;
	cursor:pointer;
	text-align:center;
}
 
td.aujourdhui {
	background-color:#7A567A;
	color:#FFFFFF;
	cursor:pointer;
	text-align:center;
}
 
td.jourVide {
	background-image:url(IMG/mosaiqueJourVide.gif);
	border:1px solid #788059;
}

Avez-vous une idée de la cause du probléme ?

Merci d'avance

[jackb6]

Hello,

tu peux donner un bout du code HTML pour voir exactement comment tu as fait ?

[hedgehog]

Voici un bout du code (compilé) du tableau posant probléme.
En espérant que ca aide.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
...
<tr class="entete"><th><a href="javascript:afficheCalendrier('2','2008','calqueCalendrier','url','gestionInterne.CRA.inc.php')">&lt;</a></th><th colspan="5">Mars</th><th><a href="javascript:afficheCalendrier('4','2008','calqueCalendrier','url','gestionInterne.CRA.inc.php')">&gt;</a></th></tr>
<tr><th>L</th><th>M</th><th>M</th><th>J</th><th>V</th><th>S</th><th>D</th></tr>
 
<tr>
<td colspan="5" class="jourVide"> </td>
<td id="s1j6" class="jour" onmouseover="document.getElementById('s1j6').style.fontWeight='bold'" onmouseout="document.getElementById('s1j6').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=1&mois=3&annee=2008')">1</td>
<td id="s1j7" class="jour" onmouseover="document.getElementById('s1j7').style.fontWeight='bold'" onmouseout="document.getElementById('s1j7').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=2&mois=3&annee=2008')">2</td>
</tr>
<tr>
<td id="s2j1" class="jour" onmouseover="document.getElementById('s2j1').style.fontWeight='bold'" onmouseout="document.getElementById('s2j1').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=3&mois=3&annee=2008')">3</td>
<td id="s2j2" class="jour" onmouseover="document.getElementById('s2j2').style.fontWeight='bold'" onmouseout="document.getElementById('s2j2').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=4&mois=3&annee=2008')">4</td>
<td id="s2j3" class="jour" onmouseover="document.getElementById('s2j3').style.fontWeight='bold'" onmouseout="document.getElementById('s2j3').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=5&mois=3&annee=2008')">5</td>
<td id="s2j4" class="jour" onmouseover="document.getElementById('s2j4').style.fontWeight='bold'" onmouseout="document.getElementById('s2j4').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=6&mois=3&annee=2008')">6</td>
 
<td style="font-weight: normal;" id="s2j5" class="jour" onmouseover="document.getElementById('s2j5').style.fontWeight='bold'" onmouseout="document.getElementById('s2j5').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=7&mois=3&annee=2008')">7</td>
<td id="s2j6" class="jour" onmouseover="document.getElementById('s2j6').style.fontWeight='bold'" onmouseout="document.getElementById('s2j6').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=8&mois=3&annee=2008')">8</td>
<td id="s2j7" class="jour" onmouseover="document.getElementById('s2j7').style.fontWeight='bold'" onmouseout="document.getElementById('s2j7').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=9&mois=3&annee=2008')">9</td>
</tr>
<tr>
<td id="s3j1" class="jour" onmouseover="document.getElementById('s3j1').style.fontWeight='bold'" onmouseout="document.getElementById('s3j1').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=10&mois=3&annee=2008')">10</td>
<td id="s3j2" class="jour" onmouseover="document.getElementById('s3j2').style.fontWeight='bold'" onmouseout="document.getElementById('s3j2').style.fontWeight='normal'" onclick="versPage('gestionInterne.CRA.inc.php?jour=11&mois=3&annee=2008')">11</td>
...

[jackb6]

Difficile de recréer le truc avec ton bout de tableau, mais par contre prends garde à la spécificité des différents styles, les styles embarqués sont prioritaires sur les styles définis dans des feuilles externes... peut-être y a t'il quelque chose à creuser de ce côté là.

[hedgehog]

Désolé de ne pas donner plus de code mais le script fait appel à 6 fichiers différents.

Ce que je ne comprends pas c'est que mon tableau est contenu dans le <div> et que ce <div> est caché via la propriété CSS visibility (hidden), son contenu devrait lui aussi être caché, non ?
La il me cache tout sauf les bordures

[jackb6]

As-tu essayé de retirer les style du tableau dans la div qui devrait être cachée ?

Le problème vient probablement de là.

Sinon, tu as aussi une solution un beu bidouillée c'est de mettre la taille (height et width) à 0 quand tu la cache cela devrait résoudre ton problème.

PS : Ton exemple est pas enligne ?