Afgelopen dagen heb ik hard aan een dynamische layout zitten knutselen om in breedte volledig compatible te zijn met de nieuwe en oude layout, hiervoor gebruikte ik Firefox.
Eenmaal online ([GOM Player] Ervaringen & discussie topic) het topic aan een vriend gelinkt die Chrome als standaard browser heeft, van hem kreeg ik te horen en te zien dat de volledige layout van de boven en onderkant helemaal niet klopte. Ik probeerde daarom IE6 (I know) en kreeg hetzelfde gedrag, daarna IE8 en deze was precies zoals in Firefox, werkend.
Na even de UBB-code voor die boven en onderkant bekeken kwam ik er achter dat ik daar een lege [td]-tag had staan om die dan gewoon mee te laten rekken aangezien de breedte van de table op 100% stond. Firefox en IE8 doen dit klaarblijkelijk wel goed en IE6/7, Safari, Opera en Chrome dus niet (getest).
Die ene lege [td]-tag vervangen door een [td width=250] er links en rechts van om toch die leegte ietwat op te vullen mocht maar een klein beetje baten maar werkt niet met de aller onderste table. (oude versie in de code-versie in regel 27, de nieuwe in regels 11-13)
Hieronder de volledige code van 1 'layout' in werking en tussen [code]-blokken, bestaande uit 5 tables:
Het gaat fout in de regels 3-5, 11-13, 19-21 en 27 maar dus ook in 34-36.
Hoogstwaarschijnlijk omdat er geen content in de cellen is ingevoerd, op een paar na wat in de uiteindelijke versie van het topic te zien. Maar als ik in de lagere tabellen een spatie dmv neer ga zetten dan klopt de hoogte niet meer. en in de hogere tabellen werkt het ook niet.
De schuldige tabel waar ik nu gewoon een 400px width aan de 'foute cel heb gegeven en de width=100% uit de table-tag gehaald heb en dan werkt ie wel in IE/FF/Opera/Safari/Chrome etc.
Is er een manier om het gedrag van het niet uitrekken van cellen zonder inhoud aan te passen zodat alle browsers de boel correct weergeven of is dit gewenste gedrag onmogelijk?
Eenmaal online ([GOM Player] Ervaringen & discussie topic) het topic aan een vriend gelinkt die Chrome als standaard browser heeft, van hem kreeg ik te horen en te zien dat de volledige layout van de boven en onderkant helemaal niet klopte. Ik probeerde daarom IE6 (I know) en kreeg hetzelfde gedrag, daarna IE8 en deze was precies zoals in Firefox, werkend.
Na even de UBB-code voor die boven en onderkant bekeken kwam ik er achter dat ik daar een lege [td]-tag had staan om die dan gewoon mee te laten rekken aangezien de breedte van de table op 100% stond. Firefox en IE8 doen dit klaarblijkelijk wel goed en IE6/7, Safari, Opera en Chrome dus niet (getest).
Die ene lege [td]-tag vervangen door een [td width=250] er links en rechts van om toch die leegte ietwat op te vullen mocht maar een klein beetje baten maar werkt niet met de aller onderste table. (oude versie in de code-versie in regel 27, de nieuwe in regels 11-13)
Hieronder de volledige code van 1 'layout' in werking en tussen [code]-blokken, bestaande uit 5 tables:
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
| [table width=100% bgcolor=transparent cellpadding=0] [tr] [td background="http://gioli.nl/GOM/GOM-Lboven.png" width=106 height=45][/td] [td background="http://gioli.nl/GOM/GOM-boven.png" height=45][/td] [td background="http://gioli.nl/GOM/GOM-Rboven.png" width=106 height=45][/td] [/tr] [/table][table width=100% bgcolor=#FF9E2C cellpadding=0] [tr] [td background="http://gioli.nl/GOM/GOM-links.png" width=33 height=10][/td] [td background="http://gioli.nl/GOM/GOM-Blinks.png" width=10 height=10][/td] [td width=250][/td] [td][/td] [td width=250][/td] [td background="http://gioli.nl/GOM/GOM-Brechts.png" width=10 height=10][/td] [td background="http://gioli.nl/GOM/GOM-rechts.png" width=33 height=10][/td] [/tr] [/table][table width=100% bgcolor=#FF9E2C cellpadding=0] [tr] [td background="http://gioli.nl/GOM/GOM-links.png" width=33][/td] [td][br][br][/td] [td background="http://gioli.nl/GOM/GOM-rechts.png" width=33][/td] [/tr] [/table][table width=100% bgcolor=#FF9E2C cellpadding=0] [tr] [td background="http://gioli.nl/GOM/GOM-links.png" width=33 height=10][/td] [td background="http://gioli.nl/GOM/GOM-Olinks.png" width=10 height=10][/td] [td][/td] [td background="http://gioli.nl/GOM/GOM-Orechts.png" width=10 height=10][/td] [td background="http://gioli.nl/GOM/GOM-rechts.png" width=33 height=10][/td] [/tr] [/table][table width=100% bgcolor=transparent cellpadding=0] [tr] [td background="http://gioli.nl/GOM/GOM-Londer.png" width=168][/td] [td background="http://gioli.nl/GOM/GOM-onder.png" height=92][/td] [td background="http://gioli.nl/GOM/GOM-prefs.png" height=92 width=75][/td] [td background="http://gioli.nl/GOM/GOM-onder.png" height=92][/td] [td background="http://gioli.nl/GOM/GOM-Ronder.png" width=168][/td] [/tr] [/table] |
Het gaat fout in de regels 3-5, 11-13, 19-21 en 27 maar dus ook in 34-36.
Hoogstwaarschijnlijk omdat er geen content in de cellen is ingevoerd, op een paar na wat in de uiteindelijke versie van het topic te zien. Maar als ik in de lagere tabellen een spatie dmv neer ga zetten dan klopt de hoogte niet meer. en in de hogere tabellen werkt het ook niet.
De schuldige tabel waar ik nu gewoon een 400px width aan de 'foute cel heb gegeven en de width=100% uit de table-tag gehaald heb en dan werkt ie wel in IE/FF/Opera/Safari/Chrome etc.
Is er een manier om het gedrag van het niet uitrekken van cellen zonder inhoud aan te passen zodat alle browsers de boel correct weergeven of is dit gewenste gedrag onmogelijk?