pb vignettes sous forme de liste

Version imprimable

21/10/2008, 10h38
nanonerie

2 pièce(s) jointe(s)

pb vignettes sous forme de liste

Bonjour,
J'ai suivi le tutoriel: "Créer des vignettes redimensionnables" et je me suis perdu...lol
L'exemple est sous forme de liste alors que je cherche à placer mes images les unes à côtés des autres mais pas verticalement, ni horizontalement. Plus un genre de pèle-mèle.
j'ai retiré les <li> mais ai toujours le pb. Pouvez vous m'aider?:cry:

Exemple :

Code:

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
 
<!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" xml:lang="r" lang="r">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>Untitled</title>
	<style type="text/css" title="text/css" media="print">
/* <![CDATA[ */
.images {
	padding:5px 5px 5px 30px;
	margin:0;
}
.images img {
	border:1px solid #666666;
}
div.flottante {
	float:left;
	padding:20px;
}
/* ]]> */
</style>
</head>
<body>
<div class="images">
			<div class="flottante">
			<a href="#"><img src="thumbs/s1.jpg" alt="" /></a>
			</div>
 
			<div class="flottante">
			<a href="#"><img src="thumbs/s2.jpg" alt="" /></a>
			</div>
 
			<div class="flottante">
			<a href="#"><img src="thumbs/s3.jpg" alt="" /></a>
			</div>
 
			<div class="flottante">
			<a href="#"><img src="thumbs/s4.jpg" alt="" /></a>
			</div>
</div>
</body>
</html>

21/10/2008, 11h25
nanonerie

ok....

J'ai l'habitude de placer mes images avec des div.
Dans votre solution, les <div class="flottante">
sont pour tout le groupe.

Comment je peux faire pour les diriger individuellement?

Dans mon style je leur avais donné une place précise. Et c'est là que je coince. Elles ne veulent pas "obéir".
J'ai surement un oubli. Sinon ça fonctionne. les images sont bien cachées et apparaissent lors du survol. Reste le parking...lol
23/10/2008, 11h09
blueice

Exemple :
http://www.dimension-internet.com/dev/float2/