Firefox affiche mal si code trop long
Bonjour tout le monde!
Je me retrouve avec un problème trop bizarre que je n'avais encore jamais vu (et jamais entendu parler non plus).
Je dois faire un tableau de 40 colonnes et 40 lignes, avec du contenu dans le tableau (forcément), et du contenu sous le tableau. Dans mon tableau, je place des info-bulles sur un lien hypertexte dans chaque case.
Au bout d'un certain nombre de lignes (ça doit dépendre du nombre de caractères dans le code), Firefox ne reconnaît plus l'info-bulle et la rend visible directement dans la page, sans qu'on ait besoin de passer la souris sur le lien. J'ai fait différents tests, et j'ai vraiment l'impression que Firefox plante si le code html de la page est trop long
Pour faire simple, voici un petit exemple :
Code:
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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
<html>
<head>
<style>
.case{
font-size : 9px;
text-decoration : italic;
position : relative;
}
a.case {
text-decoration : none;
font-weight : normal;
color : #000000;
}
a.case table{
position : absolute;
top : -2000em;
left : -2000em;
width : 1px;
height : 1px;
overflow : hidden;
border : 1px solid #000000
}
a.case img{
border : none;
}
a.case:hover table, a.case:focus table, a.case:active table
{
top : 20px;
left : 0px;
width : 200px;
height : auto;
overflow : visible;
}
a.case:hover {
border : 0;
}
.info{
background-color:#000000;
color:#ffffff;
width:200px;
border : none;
}
.info_hg{
width:12px;
border:none;
}
.info_h{
text-align:right;
border : none;
display : block;
padding : 0px;
}
.info_hd{
width:13px;
border : none;
}
.info_g{
vertical-align: bottom;
border : none;
}
.info_mid{
padding:5px;
border : none;
}
.info_d{
width:13px;
vertical-align:top;
border : none;
}
.info_bg{
width:12px;
border : none;
}
.info_b{
text-align:left;
border : none;
}
.info_bd{
width:13px;
border : none;
}
</style>
</head>
<body>
<br />
<table>
<tr>
<td>
<a class="case" href="#">1-1
<table class='info' cellpadding='0' cellspacing='0'>
<tr>
<td class='info_hg'></td>
<td class='info_h'></td>
<td class='info_hd'></td>
</tr>
<tr>
<td class='info_g'></td>
<td class='info_mid'>??</td>
<td class='info_d'></td>
</tr>
<tr>
<td class='info_bg'></td>
<td class='info_b'></td>
<td class='info_bd'></td>
</tr>
</table>
</a>
</td>
<tr>
</table>
</body>
</html> |
Vous voyez, en passant la souris sur le lien, l'info-bulle apparaît. Tout va bien. Copiez maintenant la table une centaine de fois (113 pour moi), et les "??" vont apparaître en dur dans la page. Firefox a rajouté une ouverture de balise "a" avant la fermeture du tableau, donc il ne comprend plus le style.
Est-ce que quelqu'un a déjà rencontré le problème? Y a-t-il une solution?
Merci pour vos réponses!
