Check alle échte Black Friday-deals Ook zo moe van nepaanbiedingen? Wij laten alleen échte deals zien

Gedrag van tables met lege [td]'s in verschillende browsers

Pagina: 1
Acties:
  • 227 views

  • Wiethoofd
  • Registratie: Juli 2007
  • Laatst online: 17-11 00:47

Wiethoofd

Broadcast TOM

Topicstarter
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:





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?

Volg me op Twitter/X & Bluesky


  • Wiethoofd
  • Registratie: Juli 2007
  • Laatst online: 17-11 00:47

Wiethoofd

Broadcast TOM

Topicstarter
Deze kan dicht, met een [nohtml] [/norml] in elke lege cel wordt de boel opeens wel crossbrowser goed weergegeven zolang de table een dynamische ipv fixed breedte heeft.


[td background=afbeelding width=60][/td] gaat dus fout
[td background=afbeelding width=60] [/td] gaat dus goed

Volg me op Twitter/X & Bluesky


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 16:06

crisp

Devver

Pixelated

Da's inderdaad /de/ fix voor stommem browsers die empty-cells: show niet begrijpen, maar ik zal eens kijken of dat ook expliciet in de CSS staat - dat zou het in ieder geval voor alle non-IE<8 browsers fixen :)

Intentionally left blank


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 16:06

crisp

Devver

Pixelated

empty-cells initial value is al 'show' volgens de specificatie, dus de &nbsp;-truuk is inderdaad de enige oplossing voor IE...

Intentionally left blank


Dit topic is gesloten.