[XHTML] Séparations entre cellules de tableau

**vinczente** · 19/08/2008, 20h28

Bonjour,
J'essaye de conscruire une page html et j'utilise des tableaux afin de ne pas trop y perdre du temps.
J'aimerais savoir pourquoi avec mon code, les cellules sont separees par une ligne blanche, que je n'arrive pas a supprimer.
Merci pour votre 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
 
<!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">
<head>
<title>Accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/default.css"  />
</head>
<body>
<table border=0 cellspacing=0 align=center>
<tr height=181><TH ROWSPAN=4><img src="pictures/left.png"></TH><td><img src="pictures/header.png"></td><TH ROWSPAN=4><img src="pictures/right.png"></TH></tr>
<tr><td height=222px>Menu</td></tr>
<tr><td width=752 class="text" height=580px>
BlaBlaBla
</td></tr>
<tr height=119px><td><img src="pictures/footer.png"></td></tr>
</table>
</body>
</html>

**c_s_s** · 19/08/2008, 22h20

Bonsoir,

Pour commencer, il y a beaucoup d'erreur dans ton code qu'il serait bon de corriger.

1- Il vaut mieux mettre les valeurs des propriétes HTML entre guillemets. Pas besoin de spécifier d'unité pour les valeurs HTML.

<td height=580px> => incorrect

<td height="580"> => correct

Si tu veux mettre une unité, il faut le faire en CSS :

<td style="height:580px;">

2- La balise <th> détermine le contenu des cellules en tête de colonne. C'est une aberration d'utiliser cette balise pour y mettre une image qui occupe toute la hauteur de ta table.
Dans ton cas, autant utiliser la balise <td>.

Code html :

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

1
2
3
4
5
<tr>
	<td rowspan="4">...</td>
	<td>...</td>
	<td rowspan="4">...</td>
</tr>

3- Les balises <th> ne sont pas censées contenir des attributs de largeur (width) ou de hauteur (height). Mieux vaut les mettres sur les balises <td>.

Code :

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

1
2
3
<tr>
	<td height="119">...</td>
</tr>

4- Les balises et leurs propriétes doivent être écrites en minuscules en XHTML strict.

5- En XHTML Strict, la grande majorité des balises ouvertes doivent être fermées. C'est valable pour les images.
Il faut aussi penser au texte alternatif.

Code :

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

<img src="pictures/footer.png" alt="Pied de page" />

Corriger toutes ces erreurs te permettra d'avoir une page nettement moins invalide.

Pour ton problème, je ne vois pas d'espace entre les cellules (peut-être parce que je n'ai pas les images de fond).

Un cellpadding="0" sur la table résoudra peut-être ton problème.

**12monkeys** · 19/08/2008, 22h29

Bonsoir

Tu utilises un doctype xhtml mais tu n'en respectes pas les règles : plus de 50 erreurs à la validation...
Il faut mettre les valeurs des attributs entre guillemets, les balises et attributs sont à mettre en minuscule, enfin il ne faut pas mettre d'unité aux valeurs des attributs...
Tu utilises aussi des attributs comme align="center" qui doivent être passés par le css et pas dans une balise html...

Maintenant pour ton problème essaye voir :

Code :

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

<table border="0" cellspacing="0" cellpadding="0">

edit : grillé

**romain_ci** · 26/08/2008, 18h00

Je rajouterai même que la mise en forme CSS na rien a faire dans les balises.

Utilise un CSS externe et fait toi des classes.

[XHTML] Séparations entre cellules de tableau

HTML

Vue hybride

Discussions similaires

Partager

Partager