Salut à tous,

J'ai décidé d'apprendre à utiliser les div pour designer plus facilement mes pages web. J'ai des problèmes avec le positionnement que je trouve un peu obscur à comprendre...

Imaginons une succession de blocs placés de cette manière:



Voici comment je code ça:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
<div id="contener">
     <div id="1"></div>
     <div id="2"></div>
     <div id="3"></div>
     <div id="4"></div>
     <div id="5"></div>
</div>
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
#1{
     float:left;
     width:qqch px;
     height:qqch px;
}
#2{
     float:left;
     width:qqch px;
     height:qqch px;
}
#3{
     float:left;
     width:qqch px;
     height:qqch px;
}
#4{
     float:left;
     width:qqch px;
     height:qqch px;
}
#5{
     float:left;
     width:qqch px;
     height:qqch px;
}
Disons qu'ensuite, je veuille combler le trou situé entre les blocs 1 et 5 et sous les blocs 2, 3, 4, comment m'y prendre?



J'essaye ceci mais le bloc n°6 reste sous les autres:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
<div id="contener">
     <div id="1"></div>
     <div id="2"></div>
     <div id="3"></div>
     <div id="4"></div>
     <div id="5"></div>
     <div id="6"></div>
</div>
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
#1{
     float:left;
     width:qqch px;
     height:qqch px;
}
#2{
     float:left;
     width:qqch px;
     height:qqch px;
}
#3{
     float:left;
     width:qqch px;
     height:qqch px;
}
#4{
     float:left;
     width:qqch px;
     height:qqch px;
}
#5{
     float:left;
     width:qqch px;
     height:qqch px;
}
#6{
     clear:both;
     width:qqch px;
     height:qqch px;
}