probleme avec des border de table

**Joe Le Mort** · 01/03/2007, 10h44

Bonjour a tous,

j'ai un soucis avec un border.

comme vous pouvez le voir en 1, j'ai une image arrondi en background.
Si je fais un table border 1, ca ne va pas, car il y a toujours un pixel d'écart entre un background image et un border normal.

Donc j'ai décidé de mettre un border-left sur les ligne en bleu clair, ca marche bien, mais je dois séparé toutes mes TD d'une bordure blanche !
donc j'ai fais ceci :

Code :

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

1
2
3
4
5
6
7
.border_tdgauche{
	border-top:1px solid  #FFFFFF;
	background-image : url(/images/border_panier.gif);
	background-position:  left top ;
	background-repeat:  repeat-y;
	background-color:#dbf3f5;
}

Comment faire pour cacher le pixel en "2" de mon border-top blanc entre les border-left bleu ??

**E.Bzz** · 01/03/2007, 11h09

Bonjour,
tu as essayé d'ajouter padding et/ou margin à 0 ?

A+

**Joe Le Mort** · 01/03/2007, 11h14

le padding et margin sont sur le css du table.
j'ai essayé sur le td, ca ne fait rien

**E.Bzz** · 01/03/2007, 11h17

Ca viendrait pas de là, des fois

Code :

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

border-top:1px solid  #FFFFFF;

A+

**MasterOfChakhaL** · 01/03/2007, 11h33

Salut,

je ne garanti rien mais j'essairai cela:

Code :

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

1
2
3
4
5
6
7
8
9
.border_tdgauche{
	border-bottom:1px solid  #FFFFFF;
	margin-top:-1px;
	background-image : url(/images/border_panier.gif);
	background-position:  left top ;
	background-repeat:  repeat-y;
	background-color:#dbf3f5;
}

le but du jeu est de créer des chevauchements poura masque la bordure horizontale d'un element par la bordure verticale de l'élément en dessous.

Pourquoi ne pas faire ca sur les tr plutôt?

**Joe Le Mort** · 01/03/2007, 11h54

Envoyé par E.Bzz

Ca viendrait pas de là, des fois

Code :

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

border-top:1px solid  #FFFFFF;

A+

en fait c'est ce que je dois avoir en plus du border left bleu !
il me faut absolument un border top ou bottom de la TD en blanc !

@Master : Non ca ne va pas.

**E.Bzz** · 01/03/2007, 12h02

T'as qu'à mettre un liseret blanc d'1 px en haut de ton /images/border_panier.gif et virer le border-top ...

A+

**E.Bzz** · 01/03/2007, 12h03

Envoyé par Joe Le Mort

@Master : Non ca ne va pas.

Heu ... ça ferait plus avancer les choses de préciser pourquoi

**MasterOfChakhaL** · 01/03/2007, 12h34

re,

Chez moi, ceci fonctionne:

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
<!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>
  <meta http-equiv="content" content="application/xhtml+xml; charset=utf-8"/>
  <title>test</title>
 
<style type="text/css">
* {
	padding:0;
	margin: 0;
}
tbody th {
	border-left: 1px solid #0f0;
}
tbody tr * {
	border-bottom: 1px solid #f00;
	background-color: #00f;
	margin-top: -1px;
}
</style>
</head>
 
<body>
			<table cellspacing="0">
				<thead>
					<tr>
						<th>blabla</th>
						<th>babla</th>
 
					</tr>
				</thead>
				<tbody>
					<tr>
						<th>...</th>
						<td>...</td>
					</tr>
					<tr>
 
						<th>...</th>
						<td>...</td>
					</tr>
				</tbody>
			</table>
 
</body>
</html>

ou alors, je n'ai pas compris ce que tu voulais faire...

**Joe Le Mort** · 01/03/2007, 14h22

comme ce que j'ai dit, sur l'image, c'est point 2, surpprimer la bordure blanche a gauche pour qu'on ait uniquement un border bleu

Invité · 01/03/2007, 14h29

Je doute que cela soit possible dans ta situation... mais si qqun à une réponse cela m'intéresse aussi

**E.Bzz** · 01/03/2007, 14h31

Envoyé par E.Bzz

T'as qu'à mettre un liseret blanc d'1 px en haut de ton /images/border_panier.gif et virer le border-top ...

Tu as essayé ?

**Joe Le Mort** · 01/03/2007, 15h48

Envoyé par E.Bzz

Tu as essayé ?

yes, j'ai passé une bordure d'un pixel banc en background sur le TR
puis pareil avec le pixel bleu sur le TD et cela fonctionne

Merci !!!

**Joe Le Mort** · 01/03/2007, 16h04

Alors nouveau probleme... très facheux, ca marche sous FF mais IE7 n'aime pas ca !

CSS de la ligne

Code :

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

1
2
3
4
5
6
#panier .ligne1{
	background-color: #dbf3f5;
	background-image : url(/images/common/panier/border_panier_blanc.gif);
	background-position:  right top ;
	background-repeat:  repeat-x;
}

css de la cellule a gauche pour le border left bleu

Code :

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

1
2
3
4
5
6
7
.border_tdgaucheligne1{
	background-image : url(/images/common/panier/border_panier.gif);
	background-position:  left top ;
	background-repeat:  repeat-y;
	border-right:1px solid  #FFFFFF;
 
}