Salut,
En fait la question c'est plutôt : souhaites-tu gérer le positionnement à la mano ou veux-tu un truc automatique. Dans les deux cas tu as un inconvénient. À toi d'évaluer.
POSITIONNEMENT MANUEL
Le problème est que tu dois fournir le left et le top de chaque image dans la CSS :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css" media="screen">
div {
width:200px;
height:200px;
position:absolute;
}
#a {background-color:red; left:10px ; top:10px;}
#b {background-color:blue; left:20px; top:20px;}
#c {background-color:green; left:30px; top:30px;}
#d {background-color:pink; left:40px; top:40px;}
#e {background-color:orange; left:50px; top:50px;}
#f {background-color:yellow; left:60px; top:60px;}
#g {background-color:brown; left:70px; top:70px;}
</style>
</head>
<body>
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="d"></div>
<div id="e"></div>
<div id="f"></div>
<div id="g"></div>
</body>
</html>
POSITIONNEMENT AUTOMATIQUE
Le problème est que le HTML ne sera pas sémantique :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css" media="screen">
div {
width:200px;
height:200px;
position:absolute;
left:10px;
top:10px;
}
#a {background-color:red}
#b {background-color:blue}
#c {background-color:green}
#d {background-color:pink}
#e {background-color:orange}
#f {background-color:yellow}
#g {background-color:brown}
</style>
</head>
<body>
<div id="a">
<div id="b">
<div id="c">
<div id="d">
<div id="e">
<div id="f">
<div id="g">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
PS : J'ai utilisé des div pour l'exemple. Évidemment ça marche avec les éléments que tu veux (li, img, p, etc.)
Modifié par marcv (21 Apr 2009 - 16:15)