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
| <!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>
.btn{
position:relative;
top:20px;
left:15px;
width:75px;
height:20px;
margin:auto;
display:inline-block;
border:2px solid black;
background-color:#CCCCCC;
text-align:center;
border-radius:10px 3px;
font-weight:bold;
}
</style>
</head>
<body>
<div id='wrap' style='width:100%;'>
<div id="container" style="margin: 15 15 0 15; width: 100%;">
<div id="div1" style="width: 100%;background-color: blue;">
DIV 1
</div>
<div id="div2" style="float: left; width: 25%; height: 250px; margin: 15 0 0 0; background-color: red;">
DIV 2
</div>
<div id="container_3_4" style="float: left; width: 50%;">
<div id="div3" style="width: 100%; height: 50px; background-color: green;">
DIV 3
</div>
<div id="div4" style="width: 100%; height: 200px; background-color: yellow;">
DIV 4
</div>
</div>
<div id="div5" style="float: left; width: 25%; height: 250px; background-color: pink;">
DIV 5
</div>
<div id="container_6_7" style="float: left; width: 75%;">
<div id="div6" style="width: 100%; height: 75px; background-color: purple;">
DIV 6
</div>
<div id="div7" style="width: 100%; height: 50px; background-color: olive;">
<div id="bouton1" class="btn" onclick="alert('#')">bout1</div>
<div id="bouton2" class="btn" onclick="alert('#')">bout2</div>
<div id="bouton3" class="btn" onclick="alert('#')">bout3</div>
<div id="bouton4" class="btn" onclick="alert('#')">bout4</div>
<div id="bouton5" class="btn" onclick="alert('#')">bout5</div>
<div id="bouton6" class="btn" onclick="alert('#')">bout6</div>
</div>
</div>
<div id="div8" style="float: left; width: 25%; height: 125px; background-color: aqua;">
DIV 8
</div>
</div>
</div>
</body>
</html> |
