Firefox
als ik deze pagina (http://www.bni-online.nl/design/) bezoek in firefox ziet ie er niet uit (het overzicht zelf). Maar als ik m in IE open is ie gewoon goed... Enig idee hoe dit kan en hoe ik dit kan oplossen?
Alvast bedankt!
html: 28 Errors, 3 warning(s)
css: 5 errors
ja als je alles valid hebt werkt het in de meeste browsers
Huh... is alt bij afbeeldingen verplicht?
Aaron schreef op 25.01.2009 18:11:
Jep, voornamelijk handig voor (blinde of slechtziende) mensen met screenreaders. Die kunnen de afbeelding niet zien, maar op basis van de alt wel inschatten wat er op het plaatje staat.Huh... is alt bij afbeeldingen verplicht?
Aaron schreef op 25.01.2009 18:11:
Huh... is alt bij afbeeldingen verplicht?
Ja, in XHTML wel.
Bij XHTML is ook bijv: <br>, <br/> Maar omdat ouwe browser dat niet altijd ondersteunen mag <br /> ook.
En Valid maken is ook aanbevolen.
in opera9 ook slecht!
Ik heb dit als html code:
Code (php)
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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
<html>
<head>
<link type="text/css" href="stijlblad.css" rel="stylesheet">
</head>
<body>
<div class='header'><img src="afbeeldingen/header.png"></div>
<div class='topmenu_container'>
<div class="topmenu_content">
<!-- Hier begint het topmenu -->
Nieuw | Overzicht | Nieuwe Post | Mijn BNI | Watchlist | PB's (0) | Instellingen | Log uit!
</div>
</div>
<div class='postmenu_container'>
<div class='postmenu_content'>
<!-- Postmenu inhoud hier! -->
<font size='+1'><strong>Beeld</strong></font>
<br>
DVD
<br>
DivX
<br>
HD
<br>
MPG
<br>
WMV
<br>
Afbeeldingen
<hr style="height:1px;">
<font size='+1'><strong>Geluid</strong></font>
<br>
Albums
<br>
Verzamel
<br>
Losse nummers
<hr style="height:1px;">
<font size='+1'><strong>Games</strong></font>
<br>
Windows
<br>
Mac
<br>
Xbox
<br>
Playstation
<br>
Nintendo
<br>
Mobiel
<hr style="height:1px;">
<font size='+1'><strong>Applicaties</strong></font>
Windows
<br>
Mac
<br>
Linux
<br>
Mobiel
<!-- Hier stopt het post-menu! -->
</div>
</div>
<div class='overzicht_container'>
<!-- Categorie kop -->
<center><font color='#000000'><h3 style='margin:0; padding:0;'>Beeld</h3></font></center>
<hr style='color:#000000;'>
<!-- Hier beginnen de 'postkoppen' (Titel, datum, poster) -->
<div class='overzicht_titelkop'><h3>Titel:</h3></div>
<div class='overzicht_datumkop'><h3>Datum:</h3></div>
<div class='overzicht_posterkop'><h3>Poster:</h3></div>
<!-- Hier eindigen de koppen -->
<div class='overzicht_content'>
<!-- Hier beginnen de posts -->
<ul class='posts'>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/dvd.png'></div>
<div class='overzicht_posttitel'>The Devil Wears Prada (2006)</div>
<div class='overzicht_postdatum'>09-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/uploaden.png'> <img src='afbeeldingen/cat/divx.png'></div>
<div class='overzicht_posttitel'>Night at the museum (2006)</div>
<div class='overzicht_postdatum'>11-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/spot.png'> <img src='afbeeldingen/cat/hd.png'></div>
<div class='overzicht_posttitel'>Jeepers Creepers 3 (2005)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/aankondiging.png'> <img src='afbeeldingen/cat/mpg.png'></div>
<div class='overzicht_posttitel'>Green Street Hooligans</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/img.png'></div>
<div class='overzicht_posttitel'>Scream</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Madmax</div>
</li>
</ul>
</div>
<br>
<!-- Categorie kop -->
<center><font color='#000000'><h3 style='margin:0; padding:0;'>Geluid</h3></font></center>
<hr style='color:#000000;'>
<!-- Hier beginnen de 'postkoppen' (Titel, datum, poster) -->
<div class='overzicht_titelkop'><h3>Titel:</h3></div>
<div class='overzicht_datumkop'><h3>Datum:</h3></div>
<div class='overzicht_posterkop'><h3>Poster:</h3></div>
<!-- Hier eindigen de koppen -->
<div class='overzicht_content'>
<!-- Hier beginnen de posts -->
<ul class='posts'>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/vzm.png'></div>
<div class='overzicht_posttitel'>Mestreechter Vastelaovends CD 1994</div>
<div class='overzicht_postdatum'>09-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Hitzone 25 (2003)</div>
<div class='overzicht_postdatum'>11-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/los.png'></div>
<div class='overzicht_posttitel'>Het huis Anubis</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Elvis Presley (De Hits Van Top 40)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Jordy Van Loon - Een Kusje Voor Jou (2008)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Madmax</div>
</li>
</ul>
</div>
</div>
<div class='infoblok_container'>
<div class="infoblok_content">
<!-- Hier begint de info -->
<font color="ec1726"><strong>
64 gebruikers online<br>
Nieuwste lid: Benny<br>
Aantal leden: 4638</strong>
</font>
<br>
<br>
Rond de jaarwisseling van 2008 op 2009 is BNI-Online gesloten vanwege een ruzie.
Hierdoor is het niet meer mogelijk om de oude software te gebruiken. Daarom zijn we nu hard aan het werk aan de nieuwe website.
<br><br>
Er zijn onderhandelingen met Disweb om BNI en Disweb samen te voegen.
</div>
</div>
</body>
</html>
<head>
<link type="text/css" href="stijlblad.css" rel="stylesheet">
</head>
<body>
<div class='header'><img src="afbeeldingen/header.png"></div>
<div class='topmenu_container'>
<div class="topmenu_content">
<!-- Hier begint het topmenu -->
Nieuw | Overzicht | Nieuwe Post | Mijn BNI | Watchlist | PB's (0) | Instellingen | Log uit!
</div>
</div>
<div class='postmenu_container'>
<div class='postmenu_content'>
<!-- Postmenu inhoud hier! -->
<font size='+1'><strong>Beeld</strong></font>
<br>
DVD
<br>
DivX
<br>
HD
<br>
MPG
<br>
WMV
<br>
Afbeeldingen
<hr style="height:1px;">
<font size='+1'><strong>Geluid</strong></font>
<br>
Albums
<br>
Verzamel
<br>
Losse nummers
<hr style="height:1px;">
<font size='+1'><strong>Games</strong></font>
<br>
Windows
<br>
Mac
<br>
Xbox
<br>
Playstation
<br>
Nintendo
<br>
Mobiel
<hr style="height:1px;">
<font size='+1'><strong>Applicaties</strong></font>
Windows
<br>
Mac
<br>
Linux
<br>
Mobiel
<!-- Hier stopt het post-menu! -->
</div>
</div>
<div class='overzicht_container'>
<!-- Categorie kop -->
<center><font color='#000000'><h3 style='margin:0; padding:0;'>Beeld</h3></font></center>
<hr style='color:#000000;'>
<!-- Hier beginnen de 'postkoppen' (Titel, datum, poster) -->
<div class='overzicht_titelkop'><h3>Titel:</h3></div>
<div class='overzicht_datumkop'><h3>Datum:</h3></div>
<div class='overzicht_posterkop'><h3>Poster:</h3></div>
<!-- Hier eindigen de koppen -->
<div class='overzicht_content'>
<!-- Hier beginnen de posts -->
<ul class='posts'>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/dvd.png'></div>
<div class='overzicht_posttitel'>The Devil Wears Prada (2006)</div>
<div class='overzicht_postdatum'>09-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/uploaden.png'> <img src='afbeeldingen/cat/divx.png'></div>
<div class='overzicht_posttitel'>Night at the museum (2006)</div>
<div class='overzicht_postdatum'>11-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/spot.png'> <img src='afbeeldingen/cat/hd.png'></div>
<div class='overzicht_posttitel'>Jeepers Creepers 3 (2005)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/aankondiging.png'> <img src='afbeeldingen/cat/mpg.png'></div>
<div class='overzicht_posttitel'>Green Street Hooligans</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/img.png'></div>
<div class='overzicht_posttitel'>Scream</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Madmax</div>
</li>
</ul>
</div>
<br>
<!-- Categorie kop -->
<center><font color='#000000'><h3 style='margin:0; padding:0;'>Geluid</h3></font></center>
<hr style='color:#000000;'>
<!-- Hier beginnen de 'postkoppen' (Titel, datum, poster) -->
<div class='overzicht_titelkop'><h3>Titel:</h3></div>
<div class='overzicht_datumkop'><h3>Datum:</h3></div>
<div class='overzicht_posterkop'><h3>Poster:</h3></div>
<!-- Hier eindigen de koppen -->
<div class='overzicht_content'>
<!-- Hier beginnen de posts -->
<ul class='posts'>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/vzm.png'></div>
<div class='overzicht_posttitel'>Mestreechter Vastelaovends CD 1994</div>
<div class='overzicht_postdatum'>09-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Hitzone 25 (2003)</div>
<div class='overzicht_postdatum'>11-01-2009</div>
<div class='overzicht_postposter'>Aaron</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/los.png'></div>
<div class='overzicht_posttitel'>Het huis Anubis</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='postoneven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Elvis Presley (De Hits Van Top 40)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Gemablock</div>
</li>
<li class='posteven'>
<div class='overzicht_posticonen'><img src='afbeeldingen/cat/done.png'> <img src='afbeeldingen/cat/alb.png'></div>
<div class='overzicht_posttitel'>Jordy Van Loon - Een Kusje Voor Jou (2008)</div>
<div class='overzicht_postdatum'>12-01-2009</div>
<div class='overzicht_postposter'>Madmax</div>
</li>
</ul>
</div>
</div>
<div class='infoblok_container'>
<div class="infoblok_content">
<!-- Hier begint de info -->
<font color="ec1726"><strong>
64 gebruikers online<br>
Nieuwste lid: Benny<br>
Aantal leden: 4638</strong>
</font>
<br>
<br>
Rond de jaarwisseling van 2008 op 2009 is BNI-Online gesloten vanwege een ruzie.
Hierdoor is het niet meer mogelijk om de oude software te gebruiken. Daarom zijn we nu hard aan het werk aan de nieuwe website.
<br><br>
Er zijn onderhandelingen met Disweb om BNI en Disweb samen te voegen.
</div>
</div>
</body>
</html>
En dit als css code:
Code (php)
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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
body{
background-color:a4aec2;
font-family:Tahoma;
color:#FFFFFF;
font-size:10pt;
}
.header{
position:absolute;
left:37px;
}
.postmenu_container{
position:absolute;
left:37px;top:116px;
background: url('afbeeldingen/postmenu.png');
width:125px;height:460px;
}
.postmenu_content{
position:absolute;
left:10px;top:10px;
}
.overzicht_container{
position:absolute;
left:180px;top:156px;
width:596px;
}
.overzicht_titelkop{
position:absolute;
left:50;
color:#000000;
}
.overzicht_datumkop{
position:absolute;
left:330px;
color:#000000;
}
.overzicht_posterkop{
position:absolute;
left:480px;
color:#000000;
}
.overzicht_content{
position:relative;
top:20px;
}
ul.posts{
list-style:none;
margin-left:0;
}
li.posteven{
background-color:#404b60;
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
margin-bottom:3px;
margin-top:3px;
}
li.postoneven{
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
margin-bottom:3px;
color:#000000;
}
.overzicht_posticonen{
position:absolute;
left:0;
margin-top:1px;
}
.overzicht_posttitel{
position:absolute;
left:50;
}
.overzicht_postdatum{
position:absolute;
left:330px;
}
.overzicht_postposter{
position:absolute;
left:480px;
}
.topmenu_container{
position:absolute;
left:178px;top:116px;
background-image: url('afbeeldingen/topmenu.png');
width:819;height:28;
}
.topmenu_content{
text-align:center;
position:relative;
top:25%;
}
.infoblok_container{
position:absolute;
left:810px;top:180px;
background-image: url('afbeeldingen/infoblok.png');
width:186px;height:339px;
}
.infoblok_content{
position:absolute;
left:10px;top:10px;
}
background-color:a4aec2;
font-family:Tahoma;
color:#FFFFFF;
font-size:10pt;
}
.header{
position:absolute;
left:37px;
}
.postmenu_container{
position:absolute;
left:37px;top:116px;
background: url('afbeeldingen/postmenu.png');
width:125px;height:460px;
}
.postmenu_content{
position:absolute;
left:10px;top:10px;
}
.overzicht_container{
position:absolute;
left:180px;top:156px;
width:596px;
}
.overzicht_titelkop{
position:absolute;
left:50;
color:#000000;
}
.overzicht_datumkop{
position:absolute;
left:330px;
color:#000000;
}
.overzicht_posterkop{
position:absolute;
left:480px;
color:#000000;
}
.overzicht_content{
position:relative;
top:20px;
}
ul.posts{
list-style:none;
margin-left:0;
}
li.posteven{
background-color:#404b60;
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
margin-bottom:3px;
margin-top:3px;
}
li.postoneven{
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
margin-bottom:3px;
color:#000000;
}
.overzicht_posticonen{
position:absolute;
left:0;
margin-top:1px;
}
.overzicht_posttitel{
position:absolute;
left:50;
}
.overzicht_postdatum{
position:absolute;
left:330px;
}
.overzicht_postposter{
position:absolute;
left:480px;
}
.topmenu_container{
position:absolute;
left:178px;top:116px;
background-image: url('afbeeldingen/topmenu.png');
width:819;height:28;
}
.topmenu_content{
text-align:center;
position:relative;
top:25%;
}
.infoblok_container{
position:absolute;
left:810px;top:180px;
background-image: url('afbeeldingen/infoblok.png');
width:186px;height:339px;
}
.infoblok_content{
position:absolute;
left:10px;top:10px;
}
Waar zit de fout nu?
Gewijzigd op 01/01/1970 01:00:00 door Aaron
Aaron schreef op 25.01.2009 19:56:
Ik begrijp 't niet... Het zou eigenlijk niet aan dat valideren moeten liggen want dat zijn slechts van die kleine dingen als 'alt'.
Tuurlijk. Niet echt belangrijk valideren.
HTML: 25 Errors, 2 warning(s)
CSS: 5 errors (allemaal: Ongeldig getal)
Edit: En een rijbewijs halen is ook maar onzin. ;-)
Gewijzigd op 01/01/1970 01:00:00 door - SanThe -
Ja dat klopt wel... ik heb m ook al door de validator gehaald maar dit zijn geen fouten die de hele lay-out kunnen verpesten. Behalve die div die niet open staat... Dat begrijp ik dus ook niet want die staat wel open. Waarom zegt ie dan dat ie niet open staat?
Omdat ie waarschijnlijk niet open staat?....
Jawel kijk maar in de code... Hij staat open....
Aaron schreef op 25.01.2009 20:05:
En waarom los je deze rotzooi niet eerst eens op? Jouw code is niet correct, dus is het redelijk onzinnig om te gaan klagen dat je code niet (goed) werkt. Wanneer de code helemaal correct is en goed werkt in bv. Firefox, Opera en Safari (browsers die met correct html werken), ga dan pas de gekke fratsen uithalen om de boel werkend te krijgen in IE. IE is kut en zuigt aan alle kanten, daar ga je dus pas op het laatst mee aan de slag.Ja dat klopt wel... ik heb m ook al door de validator gehaald maar dit zijn geen fouten die de hele lay-out kunnen verpesten. Behalve die div die niet open staat... Dat begrijp ik dus ook niet want die staat wel open. Waarom zegt ie dan dat ie niet open staat?
Zonder correcte html heeft het geen zin om verder te gaan, dan wordt het schieten op een bewegend doel.
Ik vroeg of iemand een oplossing voor dit probleem had... wil je me niet helpen dan doe je dat niet maar ga dan niet zo doen. Ik weet dat IE een hele slechte browser is en ik klaag niet maar ik vraag.
Mvg Aaron
Dan kunnen we je verder helpen :D.
Ok zal ik doen;)