tabel doet raar
Ik heb een tabels gemaakt als basis voor mijn website, maar deze doet een beetje raar. Als ik de tabel helemaal leeg maak doet ie het goed, maar zodra ik er tekst (een paar woorden) of een plaatje pakt hij ineens de maten die ik opgegeven heb niet meer. Wie weet wast dit is? Het gaat om de volgende tabel.
<table width=100% height=100%>
<tr height=15px><td colspan=6></td></tr>
<tr height=125px>
<td width=15px rowspan=3></td>
<td width=15px class=zbalk rowspan=2></td>
<td colspan=3>
<table height=100% width=100%>
<tr height=125px>
<td> <img src=images/top.jpg height=125px>
</td>
</tr>
</table>
</td>
<td width=15px rowspan=3></td>
</tr><tr>
<td width=150px></td>
<td width=15px rowspan=2></td>
<td rowspan=2></td>
</tr><tr>
<td width=15px></td>
<td width=150px></td>
</tr>
<tr height=15px><td colspan=6><div class=bottom></div></td></tr>
</table>
Dit heb ik de stylesheet gezet
body {background:#ffffff;
overflow: auto;
margin: 0px;
}
table {overflow: hidden;
border: 1px solid #000000;
padding: 0px;
margin: 0px;
background:#ffffff;
border-collapse: collapse;
table-layout: auto;
}
td {border: 1px solid #000000;
padding: 0px;
margin: 0px;
font-family: Verdana, Arial, MS Sans Serif, sans-serif;
font-size: 15px;
background:#ffffff;
vertical-align: top;
display: table-cell;
}
.zbalk {background: #afe000;}
.bottom {font-family: Verdana, Arial, MS Sans Serif, sans-serif;
font-size: 10px;
color: #808080;
}
Alvast heel erh bedankt, ik snap er niks van.
Koen
Wat je misschien is kan proberen is helemaal boven het document
Code (php)
1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Te zetten en tussen je <head>
Code (php)
1
<meta http-equiv="content-type" content="text/html; charset=utf-8">
Hier ben ik na een aantal jaren achter gekomen en het is er een stuk beter op geworden sinds ik ze wel gebruik, misschien dat het bij jou ook het een en ander oplost.
Misschien dat je ook een voorbeeld kan geven hoe het er uitziet als het goed is en hoe fout, dan weten we in welke richting we het moeten zoeken.
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
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
<?
<table width=100% height=100%>
<tr height=15px><td colspan=6></td></tr>
<tr height=125px>
<td width=15px rowspan=3></td>
<td width=15px class=zbalk rowspan=2></td>
<td colspan=3>
<table height=100% width=100%>
<tr height=125px>
<td> <img src=images/top.jpg height=125px>
</td>
</tr>
</table>
</td>
<td width=15px rowspan=3></td>
</tr><tr>
<td width=150px></td>
<td width=15px rowspan=2></td>
<td rowspan=2></td>
</tr><tr>
<td width=15px></td>
<td width=150px></td>
</tr>
<tr height=15px><td colspan=6><div class=bottom></div></td></tr>
</table>
?>
<table width=100% height=100%>
<tr height=15px><td colspan=6></td></tr>
<tr height=125px>
<td width=15px rowspan=3></td>
<td width=15px class=zbalk rowspan=2></td>
<td colspan=3>
<table height=100% width=100%>
<tr height=125px>
<td> <img src=images/top.jpg height=125px>
</td>
</tr>
</table>
</td>
<td width=15px rowspan=3></td>
</tr><tr>
<td width=150px></td>
<td width=15px rowspan=2></td>
<td rowspan=2></td>
</tr><tr>
<td width=15px></td>
<td width=150px></td>
</tr>
<tr height=15px><td colspan=6><div class=bottom></div></td></tr>
</table>
?>
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
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
<?
<table width=100% height=100%>
<tr height=15px>
<td colspan=6></td>
</tr>
<tr height=125px>
<td width=15px rowspan=3></td>
<td width=15px class=zbalk rowspan=2></td>
<td colspan=3>
<table height=100% width=100%>
<tr height=125px>
<td>
<img src=images/top.jpg height=125px>
</td>
</tr>
</table>
</td>
<td width=15px rowspan=3></td>
</tr>
<tr>
<td width=150px></td>
<td width=15px rowspan=2></td>
<td rowspan=2></td>
</tr>
<tr>
<td width=15px></td>
<td width=150px></td>
</tr>
<tr height=15px>
<td colspan=6>
<div class=bottom>
</div>
</td>
</tr>
</table>
?>
<table width=100% height=100%>
<tr height=15px>
<td colspan=6></td>
</tr>
<tr height=125px>
<td width=15px rowspan=3></td>
<td width=15px class=zbalk rowspan=2></td>
<td colspan=3>
<table height=100% width=100%>
<tr height=125px>
<td>
<img src=images/top.jpg height=125px>
</td>
</tr>
</table>
</td>
<td width=15px rowspan=3></td>
</tr>
<tr>
<td width=150px></td>
<td width=15px rowspan=2></td>
<td rowspan=2></td>
</tr>
<tr>
<td width=15px></td>
<td width=150px></td>
</tr>
<tr height=15px>
<td colspan=6>
<div class=bottom>
</div>
</td>
</tr>
</table>
?>
http://home.tiscali.nl/koenvreke/tabelprobleem/1.JPG
De ruimtes aan de zijkant zijn ook kolom dus zijn het er volgens mij toch 6. Ik heb een nieuwe vreemde ontdekking gedaan. In firefox doet ie het wel goed. Het probleem is alleen bij internet explorer. Daarom heb ik de bovenstaande tip van strct gemaakt en hem gevalideert bij w3s. Ik krijg daar de volgende foutmeldingen:
http://home.tiscali.nl/koenvreke/tabelprobleem/2.JPG
Erg vreemd, als je het mij vraagt klopt dit wel namelijk