[css] Probleme avec background repeat

**meda** · 09/01/2006, 10h38

Bonjour tout le monde,

J'ai deux petits problèmes de présentation dans une page xhtml avec des feuilles de style css que je n'arrive pas résoudre.
- le premier est que je voudrais faire un background-repeat sur une image de fond mais celle ci ne se fait pas.
- Cette image de fond apparait avec internet explorer mais il y a un espace avec l'image du dessus.
Voici le lien pour voir le problème :
http://www.leasysite.com/test2/

mon code html :

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
 
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Administration</title>
		<link rel="stylesheet" type="text/css" href="base.css" />
		<link rel="stylesheet" type="text/css" href="style.css" />
	</head>
	<body>
		<div class="admin">
			<div class="administration">
				<img src="Haut.gif" border="0px">
			</div>
			<div class="menu">
				<div class="inline"><img src="Gauche_orange.gif" height="45" width="24"></div><div class="texte"><img src="Index.gif" height="27" width="59"><img src="Administration.gif" height="27" width="108" ><img src="News.gif" height="27" width="57"><img src="Menu.gif" height="27" width="75"><img src="Article.gif" height="27" width="71"><img src="Utilisateur.gif" height="27" width="92"><img src="Vide.gif" height="27" width="151"><div class="bas"><img src="Haut_bas.gif" width="613" height="18"></div></div><div class="der"><img src="Orange_droite.gif" width="13" height="45"></div></div><div class="centre"><div class="bordure">
				</div>
				<div class="milieu">
					<div class="contenu">
	<p>
		<img src="icone_utilisateur.gif" width="40px" height="40px">
		Gestion des utilisateurs
		<a href="gerer_utilisateur.php">Gerer utilisateur</a>
	</p>
	<p>
		<img src="icone_news.gif" width="40px" height="40px">
		Gestion des news
		<a href="gerer_news.php">Gerer les news</a>
	</p>
	<p>
		<img src="icone_menu.gif" width="40px" height="40px">
		Gestion des menus
		<a href="gerer_menu.php">Gérer les menus</a>
	</p>
	<p>
		<img src="icone_article.gif" width="40px" height="40px">
		Gestion des articles
		<a href="gerer_article.php">Gérer les articles</a>
	</p>
</div>
				</div>
			</div>
			<div class="spacer">
				&nbsp;
			</div>		
		</div>
	</body>
</html>

ma css

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
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
 
body {
	text-align : center;
 	padding : auto; 
 }
 div.admin { 
 	width : 650px; 
	height : 100%;
	margin-left : auto;
	margin-right : auto; 
	border : 0px; 
	border-style : solid;
	border-color : black; 
}
div.administration {
	 width : 650px; 
	 height : 103px;
}
img {
	border-width : 0em;
	margin : 0em;
	padding : 0em;
	font-size : 1px;
	vertical-align : middle;
	line-height : 1px;
}
div.menu { 
	width : 650px; 
	height: 45px; 
	float : left;
	text-align : left;
}
div.inline {
	display : inline;
	height : 45px;
	width : 24px;
	float : left;
}
div.texte {
	width : 613px;
	height : 27px;
	float : left;
	display : inline;
}
div.der {
	width : 13px;
	height: 45px;
	float : left;
}
div.bas {
	width : 613px;
	height : 18px;
	float : left;
}
div.centre {
	width : 650px; 
	text-align : left; 
	float : left;
	border-width : 0px;
}
div.bordure {
	width : 24px;
	border-width: 0px;
	float : left;
	display : block;
	clear : both;
	background-position : top left;
	background-image : url('Gauche.gif');
	background-repeat : repeat-y;
}
div.contenu {
	float : left;
}
div.milieu {
	float : left;
	whidth : 500px;
}
div.spacer {
	clear : both;
}

Si j'affecte une valeur a height dans div.bordure alors j'ai bien un background repeat cependant comme le contenu va être dynamique celui ci va changer selon la page.
Si quelqu'un à une idée merci de m'aider.[/url]

**meda** · 09/01/2006, 17h37

Bon j'ai un peu avancé mais c est de pire en pire. Si quelqu'un pourrait m'aider cela serait sympa.

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
53
54
55
56
57
 
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Administration</title>
		<link rel="stylesheet" type="text/css" href="base.css" />
		<link rel="stylesheet" type="text/css" href="style.css" />
	</head>
	<body>
		<div class="admin">
			<div class="administration">
				<img src="Haut.gif" alt="" />
			</div>
			<div class="menu">
				<div class="inlinemenu"><img src="Gauche_orange.gif" alt="" /></div>
				<div class="texte">
					<div class="menutexte" id="fontmenu">
						<a class="menu_lien" href="index.php">Acceuil</a>|<a class="menu_lien" href="administration">Administration</a>|<a class="menu_lien" href="configuration.php">configuration</a>|<a class="menu_lien" href="gerer_menu.php">menu</a>|<a class="menu_lien" href="gerer_article.php">article</a>|<a class="menu_lien" href="gerer_news.php">news</a>|<a class="menu_lien" href="gerer_utilisateur.php">utilisateur</a>
					</div>
					<div class="bas"><img src="Haut_bas.gif" width="613" height="18" alt="" /></div>
				</div>
				<div class="der"><img src="Orange_droite.gif" alt="" /></div>
			</div>
			<div class="centre">
				<div class="bordure">
					&nbsp;
				</div>
				<div class="milieu">
					<div class="contenu">
	<p>
		<img src="icone_utilisateur.gif" width="40px" height="40px">
		Gestion des utilisateurs
		<a href="gerer_utilisateur.php">Gerer utilisateur</a>
	</p>
	<p>
		<img src="icone_news.gif" width="40px" height="40px">
		Gestion des news
		<a href="gerer_news.php">Gerer les news</a>
	</p>
	<p>
		<img src="icone_menu.gif" width="40px" height="40px">
		Gestion des menus
		<a href="gerer_menu.php">Gérer les menus</a>
	</p>
	<p>
		<img src="icone_article.gif" width="40px" height="40px">
		Gestion des articles
		<a href="gerer_article.php">Gérer les articles</a>
	</p>
</div>
				</div>
				<div class="spacer">
					&nbsp;
				</div>
			</div>		
		</div>
	</body>
</html>

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
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
131
132
133
134
 
body {
	text-align : center;
 }
div.admin { 
 	width : 650px; 
	height : 100%;
	border : 0px;
	margin-left : auto;
	margin-right : auto; 
	border-style : solid;
	border-color : black; 
}
div.administration {
	 width : 650px; 
	 height : 103px;
	 float : left;
}
div.menu { 
	width : 100%; 
	height: 45px; 
	text-align : left;
	float : left;
	display : block;
}
div.centre {
	width : 100%;
	height : 45px;
	border-left-width: 0px;
	border-right-width : 0px;
	border-top-width : 0px;
	border-bottom-width : 0px;
	text-align : left;
	display : block;
	float : left;
}
div.bordure {
	width : 24px;
	height : 100%;
	float : left;
	border-width : 0px;
	display : inline;
	border-style : solid;
	background-image : url('../Image/Gauche.gif');
	background-repeat : repeat-y;
}
div.milieu {
	float : left;
	width : 626px;
	height : 100%;
	border : 0px;
}
div.spacer {
	clear : both;
}
 
<!-- Contenu pour la strucuture menu-->
 
div.inlinemenu {
	display : inline;
	height : 45px;
	width : 24px;
	float : left;
}
div.texte {
	width : 613px;
	height : 45px;
	float : left;
	display : inline;
}
div.menutexte {
	width : 613px;
	height : 27px;
	float : left;
	background-color : #F5A907;
	display : block;
}
div.bas {
	width : 613px;
	height : 18px;
	float : left;
	display : block;
}
div.der {
	width : 13px;
	height: 45px;
	display : block;
	float : left;
}
 
 
 
 
 
div.contenu {
	float : left;
	width : 100%;
}
#bordure {
	color : #3167F0;
	border-width : 2px;
	border-style : solid;
}
div.bleu_gauche {
	height : 23px;
	float : left;
	width : 11px;
	display : inline;
}
div.bleu_droite {
	height : 23px;
	float : left;
	width : 30px;
	display : block;
}
div.newss {
	float : left;
	width : 100%;
	display : block;
}
div.bleu {
	background-color : #3167F0;
	float : left;
	display : inline;
}
.inline {
	float : left;
	display : inline;
}
.block {
	display : block;
	width : 100%;
	float : left;
}

**meda** · 10/01/2006, 09h38

Personne a une idée pour mon problème ?

[css] Probleme avec background repeat

CSS

Discussions similaires

Partager

Partager