[HTML] bordure html qui ne devrait pas exister

**moi89** · 10/06/2009, 10h55

voila ma page :

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
<html>
<style type="text/css">
.rule-ListHeader {
        background: #CDDDE4 none repeat scroll 0 0;
        border-bottom: 1px solid #FFFFFF;
        color: #000000;
        font-size: 12px;
        font-weight: bold;
        margin: 0 0 1px;
        padding: 3px 0 3px 8px;
        text-align: center;
        text-transform: uppercase;
    padding: 0px 0px 0px 0px;
}
 
.rule-SelectedRow {
        background: url(images/gray_gradient.gif) repeat-x;
}
 
.rule-List {
        font-size: 11px;
        font-weight: normal;
        text-align: center;
        padding: 3px 3px 3px 8px;
        background: #F1F1F1 none repeat scroll 0 0;
}
 
.rule-ListEvenRow,.DatePicker .weekheader {
        font-size: 11px;
        font-weight: normal;
        text-align: center;
        padding: 3px 3px 3px 8px;
        background: #F1F1F1 none repeat scroll 0 0;
}
</style>
<body>
<table border="0" class="rule-List" style="width: 100%;">
	<tr class="rule-ListHeader">
		<td style=""></td>
		<td>*</td>
		<td>Name </td>
		<td>Last modified </td>
		<td>Status</td>
	</tr>
</table>
</body>
</html>

A l'affichage j'ai le header de mon tableau bleu mais avec des séparations grises et j'aimerais me débarrasser de ces bordures. Je ne vois pas du tout d'où elle vienne

**Vil'Coyote** · 10/06/2009, 11h06

salut,tu as essayé en spprimant class="rule-List" de ton table?

**thomas9501** · 10/06/2009, 11h11

Voilà le code modifié (indenté et en XHTML 1.0 Strict) :

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
<!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" lang="en" xml:lang="en">
	<head>
		<title>Title</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<style type="text/css">
                        .rule-ListHeader {
                                background: #CDDDE4 none repeat scroll 0 0;
                                border-bottom: 1px solid #FFFFFF;
                                color: #000000;
                                font-size: 12px;
                                font-weight: bold;
                                margin: 0 0 1px;
                                padding: 3px 0 3px 8px;
                                text-align: center;
                                text-transform: uppercase;
                            padding: 0px 0px 0px 0px;
                        }
                         
                        .rule-SelectedRow {
                                background: url(images/gray_gradient.gif) repeat-x;
                        }
                         
                        .rule-List {
                                font-size: 11px;
                                font-weight: normal;
                                text-align: center;
                                padding: 3px 3px 3px 8px;
                                background: #F1F1F1 none repeat scroll 0 0;
                        }
                         
                        .rule-ListEvenRow,.DatePicker .weekheader {
                                font-size: 11px;
                                font-weight: normal;
                                text-align: center;
                                padding: 3px 3px 3px 8px;
                                background: #F1F1F1 none repeat scroll 0 0;
                        }
                </style>
	</head>
	<body>
		<table class="rule-List" style="width: 100%; border:0px;">
			<tr class="rule-ListHeader">
				<td style=""></td>
				<td>*</td>
				<td>Name </td>
				<td>Last modified </td>
				<td>Status</td>
			</tr>
		</table>
	</body>
</html>

La bordure que tu vois est normal :
c'est ne pas une bordure en fait, c'est la juste l'élément table que tu vois parce que tu lui a donné un padding et une couleur de background.

Pour enlever ça, joue avec ces propriétés :

Code :

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

1
2
3
4
5
6
7
.rule-List {
	font-size: 11px;
	font-weight: normal;
	text-align: center;
	padding: 3px 3px 3px 8px;
	background: #F1F1F1 none repeat scroll 0 0;
}

**moi89** · 10/06/2009, 11h14

c'est plus ou moins idem. Au lieu d'avoir une séparation grise j'ai une séparation blanche.

**thomas9501** · 10/06/2009, 11h17

Parce que tu as du modifié la couleur ...

Pour ne plus avoir de séparation :
Enlève le padding et le background

Code :

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

1
2
3
4
5
.rule-List {
	font-size: 11px;
	font-weight: normal;
	text-align: center;
}

C'est radical mais ça marche xD

**moi89** · 10/06/2009, 11h22

C'est ce que j'ai fait, ca ne marche pas

**thomas9501** · 10/06/2009, 11h24

Humm bisard, j'ai testé le code ici et ça marche nickel ...

Tu test avec quel navigateur ?

[HTML] bordure html qui ne devrait pas exister

HTML

Vue hybride

Discussions similaires

Partager

Partager