Ik wil een footer onderaan het plaatsen. Dit is al gelukt met "bottom: 0px;" . Maar als de tekst dan langer is als het scherm en je naar beneden scrollt staat hij dan niet onderaan de pagina maar onderaan het scherm en scrollt hij niet mee.
Hoe kan ik het zo maken dat wanneer er geen scrollbalk aan de rechterkant is, de footer onderaan het scherm staat, en als er wel een scrollbalk aan de rechterkant is dat hij dan helemaal onderaan de inhoud staat..?
index.php
css:
Hoe kan ik het zo maken dat wanneer er geen scrollbalk aan de rechterkant is, de footer onderaan het scherm staat, en als er wel een scrollbalk aan de rechterkant is dat hij dan helemaal onderaan de inhoud staat..?
index.php
HTML:
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <link type="text/css" rel="stylesheet" href="Gametraders.css" /> <title>Titel van de pagina</title> </head> <body> <center> <div id="container"> <div id="logo"> </div> <div id="zoeken"> </div> <div id="zoekenrechts"> </div> <div id="menuleft"> <a href="#"><img src="images/layout/plaats.png" alt="Plaats Advertentie" style="border-bottom: 2px solid #FFFFFF; border-top: 0px; border-left: 0px; border-right: 0px;" /></a><br /> <a href="#"><img src="images/layout/aanmelden.png" alt="Aanmelden" style="border-bottom: 2px solid #FFFFFF; border-top: 0px; border-left: 0px; border-right: 0px;" /></a><br /> <a href="#"><img src="images/layout/inloggen.png" alt="Inloggen" style="border-bottom: 2px solid #FFFFFF; border-top: 0px; border-left: 0px; border-right: 0px;" /></a><br /> <a href="#"><img src="images/layout/help.png" alt="Help" style="border-bottom: 2px solid #FFFFFF; border-top: 0px; border-left: 0px; border-right: 0px;" /></a><br /> <a href="#"><img src="images/layout/infocontact.png" alt="Info & Contact" border="0px"/></a> </div> <div id="content">Content</div> <div id="menuright"> <div id="menurighttop"></div> <div id="menurightbottom"></div> </div> </div> </center> </body> </html> |
css:
Cascading Stylesheet:
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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
| * html body{ overflow:hidden; } * html .content{ height:100%; overflow:auto; } @media screen{ body .menurightbottom{ position: fixed; } } body { margin:0; background: #565656 url(images/layout/background.png) repeat-y 50% 0; } /* General font families for common tags */ font,th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif } a:link,a:active,a:visited { color : #2A95FF; border: 0px; } a:hover { text-decoration: underline; color : #2A95FF; border: 0px;} hr { height: 0px; border: solid #DADADA 0px; border-top-width: 1px;} #container { width: 1000px; border-right: 1px solid #333333; border-left: 1px solid #333333; min-height: 100%; } #content { position: absolute; width: 500px; margin-left: 162px; margin-top: 70px; } #logo { position: absolute; margin-left: 0px; background-image: url('images/layout/logo.png'); width: 232px; height: 66px; border-left: 2px solid #FFFFFF; border-top: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; } #zoeken { position: absolute; margin-left: 234px; background-image: url('images/layout/headerbg.png'); width: 613px; height: 66px; border-top: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; } #zoekenrechts { position: absolute; margin-left: 847px; background-image: url('images/layout/zoekenrechts.png'); width: 4px; height: 66px; border-top: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; border-right: 2px solid #FFFFFF; } #menuleft { position: absolute; margin-left: 0px; margin-top: 70px; background-color: #FFFFFF; width: 156px; height: 190px; border-right: 2px solid #FFFFFF; border-left: 2px solid #FFFFFF; } #menurighttop { position: absolute; margin-left: 851px; background-image: url('images/layout/menurighttop.png'); width: 145px; height: 4px; border-right: 2px solid #FFFFFF; border-left: 2px solid #FFFFFF; border-top: 2px solid #FFFFFF; } #menurightbottom { position: absolute; margin-left: 851px; bottom: 0px; background-image: url('images/layout/menurightbottom.png'); width: 145px; height: 4px; border-right: 2px solid #FFFFFF; border-left: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; } |
[ Voor 0% gewijzigd door BtM909 op 11-04-2007 09:34 ]
:strip_icc():strip_exif()/u/45765/3dfx2.jpg?f=community)
footer altijd onderaan had ik niet in mijn voorbeeld.
Nouja, eerst maar even wat andere dingen fixen. Een footer is nou ook niet echt top priority...
:strip_icc():strip_exif()/u/146648/full.jpg?f=community)
