[CSS] FF pb de bordure bas

Version imprimable

Voici un code assez simple :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
	<head>
		<style type="text/css">
			table
			{
				height: 95%;
				padding: 2px;
				border-collapse: collapse;
			}
 
			td
			{
				border: 1px #00f solid;
			}
		</style>
	</head>
	<body>
		<table>
		<tr>
			<td rowspan="2">
				1
			</td>
			<td>
				2
			</td>
			<td>
				3
			</td>
		</tr>
		<tr>
			<td colspan="2" rowspan="3">
				4
			</td>
		</tr>
		<tr>
			<td rowspan="2">
				5
			</td>
		</tr>
		</table>
	</body>
</html>

Sous firefox, la bordure du bas est invisible, comment ça se fait et comme puis-je résoudre ce pb?

Merci

Salut, je penses que le problème vient du fait que ton code n'est pas très cohérent (rowspan, colspan), si tu changes les valeur pour tout remettre d'équerre tu vois toutes les bordure

Ce code marche sous IE et FF

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
   <head>
      <style type="text/css">
         table
         {
            height: 95%;
            padding: 2px;
            border-collapse: collapse;
         }
 
         td
         {
            border: 1px #00f solid;
         }
      </style>
   </head>
   <body>
      <table>
      <tr>
         <td rowspan="2">
            1
         </td>
         <td>
            2
         </td>
         <td>
            3
         </td>
      </tr>
      <tr>
         <td colspan="2">
            4
         </td>
      </tr>
      <tr>
         <td colspan="3">
            5
         </td>
      </tr>
      </table>
   </body>
</html>

Bon développement ;-)

Sauf que ça ne ressemble plus a ce que je voulais faire...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
+---------------+------------------------+------------------------+ 
|                    |                               |                               | 
|                    |                               |                               | 
|                    |                               |                               | 
|                    +------------------------+------------------------+ 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
+---------------+                                                              | 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
|                    |                                                               | 
+---------------+--------------------------------------------------+

Salut, j'ai essayé ça

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> 
  <head> 
    <style type="text/css"> 
    table 
    {
      padding: 2px; 
      border-collapse: collapse; 
    } 
 
    td {border: 1px #00f solid;}
 
    .td1, .td4 {height: 200px;}		
    .td2, .td3, .td5 {height: 100px;}
    </style> 
  </head> 
  <body> 
  <table> 
    <tr> 
      <td rowspan="2" class="td1">1</td> 
      <td class="td2">2</td> 
      <td class="td3">3</td> 
    </tr> 
    <tr> 
      <td colspan="2" rowspan="2" class="td4">4</td> 
    </tr>
    <tr>
      <td class="td5">5</td>
    </tr>
  </table> 
  </body> 
</html>

Marche très bien sous FF mais beaucoup moins sous IE :cry:
J'espère que tu n'utilises pas ce tableau pour la mise en page de ton site ;)

24/01/2006, 13h47
Trunks

C'était juste pour la mise en page de données. C'est pas grave, j'ai fait ça avec des div. Ya des aventages et des inconvénients ...