Hallo, (ah, zie net dat de topictitel "nee, niet zo" had moeten zijn...)
Ik wil een layout maken met een header en een content gedeelte.
Naast de content wil ik een login vak hebben. Echter wil in dat de header en de content in het midden uitgelijnd blijven.
Hoe krijg ik dat voor elkaar?
Heb het idee dat ik er met een simpele float niet ben, want dan moet er weer een container omheen en dan staat het dus niet meer goed in het midden.
Mits ik dit kan oplossen met een soort correctie, maar dat zou ik dan ook even zo gauw niet weten.
Ik wil een layout maken met een header en een content gedeelte.
Naast de content wil ik een login vak hebben. Echter wil in dat de header en de content in het midden uitgelijnd blijven.
Hoe krijg ik dat voor elkaar?
Heb het idee dat ik er met een simpele float niet ben, want dan moet er weer een container omheen en dan staat het dus niet meer goed in het midden.
Mits ik dit kan oplossen met een soort correctie, maar dat zou ik dan ook even zo gauw niet weten.
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
| <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> .header_container { width:800px; height:75px; background-color:#0C9; margin-left:auto; margin-right:auto; margin-bottom:15px; } .header_content { } .main_container { width:800px; height:200px; background-color:#0C9; margin-left:auto; margin-right:auto; } .main_content { } .login_container { width:100px; height:100px; background-color:#0C9; } .login_content { } </style> </head> <body> <div class="header_container"> <div class="header_content">header</div> </div> <div class="main_container"> <div class="main_content"> content </div> </div> <div class="login_container"> <div class="login_content"> Login </div> </div> </body> </html> |