Bonjour ,
Je débute en html CSS et je suis confrontait a un problème je souhaite comprendre le fonctionnemd'encapsulation des block et je me retrouve avec une petite incohérence dans ma compréhension.
Je souhaite obtenir cette image :
malheureusement j'obtiens une autre version a la fin
Pourriez situer mon erreur et m'aider s'il vous plait je vous pressente mon humble code :
index.php
Code html : 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 <html> <header> <link rel="stylesheet" href="style.css" /> </header> <body> <div id= un > <div id= deux> <div id =trois> </div> </div> </div> <div id = quatre> </div> <div id =cinq> </div> <div id =six> </div> </body> </html>
style.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 body { overflow-x: hidden; width: 100%; height: 100% } #un { background-color: red; width: 100%; height: 15%; } #deux { margin-top: 25%; background-color: green; width: 100%; height: 50%; } #trois { margin-left: 25%; background-color: blue; width: 50%; height: 100%; } #quatre { background-color: pink; width: 100%; height: 5%; } #cinq { background-color: black; width: 100%; height: 70%; } #six { background-color: yellow; width: 100%; height: 10%; }
Partager