lien dessus une images qui n'est pas en background

**tiyolx** · 03/03/2006, 19h05

bonjour à tous,

voici mon probleme, j'ai un espace qui est surement du a mes hyperliens en dessous de mes images.

voici la situation:

j'ai une div avec 2 img et des liens mon code xhtml et 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
81
82
83
84
85
86
87
88
89
 
<!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-Type" content="text/html; charset=iso-8859-1" />
 
<title>Index</title>
 
<link rel="stylesheet" type="text/css" href="styles/cdtheque.css" />
 
</head>
 
<body>
 
<div class="conteneur">
 
	<div class="conteneur_ht">
		<a href="index.html">
		<img src="images/cdtheque_ht_g.jpg" alt="cdtheque avec ligne_rose" 
		width="500px" height="185px" />
		</a>
		<img src="images/cdtheque_ht_m.jpg" alt="ligne_rose" width="250px" height="185px" />
		<img src="images/cdtheque_ht_d.jpg" alt="tete avec ligne_rose" width="250px" height="185px" />
	</div>
 
	<div class="conteneur_m">
		<img src="images/cdtheque_m_g.jpg" alt="ligne_verte" width="500px" height="70px" />
		<img src="images/cdtheque_m_d.jpg" alt="ligne_verte" width="500px" height="70px" />
		<a href="pages/cdtheque_album.html" class="bouton">Album</a>
		&nbsp;
		<a href="pages/cdtheque_artiste.html" class="bouton">Artiste</a>
		&nbsp;
		<a href="pages/cdtheque_groupe.html" class="bouton">Groupe</a>
		&nbsp;
		<a href="pages/cdtheque_morceau.html" class="bouton">Morceau</a>
		&nbsp;
		<a href="pages/cdtheque_instrument.html" class="bouton">Instrument</a>
		&nbsp;&nbsp;
		&nbsp;&nbsp;
		<a href="pages/cdtheque_requete_sql.html" class="bouton">Requ&ecirc;te SQL</a>
		</div>
 
 
	<div class="conteneur_bas">
 
		<div class="bloc_1">
		<h4>Bienvenue dans notre CD th&egrave;que</h4>
		<p>
		Les liens ci-dessus vont vous permettre de saisir les informations de vos albums 
		pr&eacute;f&eacute;r&eacute;s. 
		Aussi vous pouvez ajouter toutes les informations relatives aux albums dont vous 
		connaissez le groupe, les artistes, les morceaux et les instruments 
		utilis&eacute;s dans les mocreaux.<br />
		Attention, toutes vos saisies doivent &ecirc;tre en miniscule sans caract&egrave;res 
		sp&eacute;ciaux.
		</p>
		<p>
		Vous avez la possibilit&eacute; de rechercher des informations particuli&egrave;res 
		gr&acirc;&ccedil;e au lien "Requ&ecirc;te SQL".
		</p>
		<p>
		Voici un exemple, vous recherchez toutes les guitaristes du groupe dire straits 
		dans le morceau "juillet and romeo" de l'album "le tout dire straits".
		</p>
		<p>
		Nous vous souhaitons une agr&eacute;ble visite de notre site, nos agences client&egrave;les 
		sont &agrave; votre &eacute;coute, tous vos commentaires sont les bienvenues.<br />
		</p>
		<p>
		<a href="pages/cdtheque_commentaire.php">Cliquez ici</a> 
		afin de nous laisser vos commentaires, merci.
		</p>
		</div>
 
		<div class="bloc_2">
		<img src="images/cdtheque_bas_d1.jpg" alt="dj_1" width="250px" height="145px" />
		<img src="images/cdtheque_bas_d2.jpg" alt="dj_2" width="250px" height="145px" />
		<img src="images/cdtheque_bas_d3.jpg" alt="dj_3" width="250px" height="180px" />
		<img src="images/cdtheque_bas_d4.jpg" alt="dj_4" width="250px" height="180px" />		
		</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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
 
body{margin:0px}
 
.conteneur
	{
	position:relative;
	top:0px;
	left:0px;
	width:1000px;
	height:580;
	}
 
/*----------------------------------------*/
 
.conteneur_ht
	{
	position:relative;
	top:0px;
	left:0px;
	width:1000px;
	height:185px;
	}
 
.conteneur_ht img{border:0px solid red;float:left}
 
/*----------------------------------------*/
 
.conteneur_m
	{
	background-color:#000000;
	position:relative;
	top:0px;
	left:0px;
	width:1000px;
	height:70px;
	}
 
 
	.bouton
		{
		position:relative;
		top:-55px;
		left:50px;
		color:#000000;
		font-family:arial;
		height:14px;
		font-size:14px;
		font-weight:bold;
		z-index:10;
		}
 
	a
		{
		border:0px solid red;
		color:#000000;
		font-family:arial;
		text-decoration:none;
		}
 
	a:hover
		{
		border:0px solid red;
		color:#CC9966;
		font-family:arial;
		text-decoration:none
		}
 
	.conteneur_m img{float:left}
 
/*----------------------------------------*/
 
.conteneur_bas
	{
	position:relative;
	top:0px;
	left:0px;
	width:1000px;
	height:325;
	}
 
	.bloc_1
		{
		position:relative;
		top:0px;
		left:0px;
		width:500px;
		height:325px;
		margin:0px;
		float:left;
		}
 
		.etiquette
			{
			position:relative;
			float:left;
			top:0px;
			left:0px;
			margin-top:5px;
			width:150px;
			height:22px;
			line-height:22px;
			vertical-align:middle;
			text-align:right;
			color:#000000;
			font-family:arial;
			font-size:12px;			
			}
 
		.element
			{
			position:relative;
			float:left;
			top:0px;
			left:0px;
			margin-top:5px;
			width:350px;
			height:22px;
			text-align:left;
			}
 
		.plus
			{		
			height:110px;
			}
 
		.envoi
			{
			position:relative;
			float:left;
			top:0px;
			left:0px;
			margin-top:5px;
			width:500px;
			height:22px;
			text-align:center;
			}			
 
		h4{padding-left:50px;font-family:arial;font-size:14px;}
 
		p{padding-left:50px;font-family:arial;font-size:12px;}
 
		.conteneur_bas a
			{
			border:0px solid red;
			color:#000000;
			font-family:arial;
			font-size:12px;
			text-decoration:none
			}
 
		.conteneur_bas a:hover
			{
			border:0px solid red;
			color:#CC9966;
			font-family:arial;
			font-size:12px;
			text-decoration:none
			}
 
	.bloc_2
		{
		position:relative;
		top:0px;
		left:0px;
		width:500px;
		height:325px;
		margin:0px;
		float:left;
		}
 
		.bloc_2 img{float:left}

voila mon probleme en images sous ie

[img]D:\apprentissagePHP\cdtheque\images\sous_firefox.jpg[/img]
[img]D:\apprentissagePHP\cdtheque\images\sous_ie.jpg[/img]

desolee mes images ne s'affiche pas alors aller voir le site xlx.free.fr avec firefox et apres avec ie vous comprendrez peut etre mieux mon probleme.

je viens de changer mon fusil d'epaule car je galere trop avec le css.
donc la class bouton a une position en absolute dans ma div et voila c'est bien plus facile tant pis pour l'exo c'est mieux comme ca de toute facon.

merci à tous de votre aide.

**gorgonite** · 03/03/2006, 19h43

écris tout sur une ligne... juste pour voir

**Auteur** · 04/03/2006, 11h10

bonjour,

j'ai un espace qui est surement du a mes hyperliens en dessous de mes images.

essaye avec align="absbottom"

Code :

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

<img align="absbottom" src="images/cdtheque_m_g.jpg" alt="ligne_verte" width="500px" height="70px" />

ou en CSS (pas sûr)

Code :

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

img{vertical-align: absbottom;}

**Kerod** · 04/03/2006, 18h40

Envoyé par gorgonite

écris tout sur une ligne... juste pour voir

+1 je dirais

Et si ca passe pas retires les  

lien dessus une images qui n'est pas en background

HTML

Discussions similaires

Partager

Partager