[layout] probleem met plaatjes in tabellen

[BasieP]

ik heb dus even aan't knoeien voor een betere layout voor me site:
http://basiep.dyndns.org/new

nu heb ik een raar probleem in zowel mozilla (firefox) als in IE

het gaat om deze code (wegens layout verneuking wat in geknipt)

code:

<table width=770 height=190 border=0 cellpadding=0 cellspacing=0>
  <tr>
    <td rowspan=6><berg plaatjes voor logo links samen 190px hoog></td>
    <td colspan=2>[img]"logo.png"></td>
[/img]
  <tr>
    <td height=15 background="menu_back.png" align="center">
      [img]"menu_textspace.gif">
[/img]
      [img]"menu_textspace.gif">
[/img]
      [img]"menu_textspace.gif">
[/img]
    <td width=15 height=15 background="menu_right.png"></td>
  </tr>
   <tr>
    <td colspan=2 height=15 background="15px_white.png"></td>
  </tr>
  <tr>
    <td width=555 height=15 background="top_mid.png"></td>
    <td width=15 height=15 background="top_right.png"></td>
  </tr>
  <tr>
    <td height=44 bgcolor="#C0C0C0">
      <div>
        text hier<br />
        en nog een regel<br />
      </div>
    </td>
    <td width=15 background="mid_right.png"></td>
  </tr>
  <tr>
    <td width=555 height=15 background="bottom_mid.png"></td>
    <td width=15 height=15 background="bottom_right.png"></td>
  </tr>
</table>

oke het probleem is als volgt:

zoals te zien is krijg ik bovenin een extra 1 pixel hoge lijn.
in IE is ie zelfs 2 pixels hoog.

hoe het komt is mij een raadsel want alle maten kloppen.

totale hoogte is 190px (aangegeven in table eigenschap)
van boven naar beneden logo.png is 86 hoog
dan 15px voor die blauwe rand
dan 15px wit
dan 15px blauwe rand
en dan die grijze content 44
en de grijze onderrand weer 15px
samen: 190px


ik heb hem gekregen toen ik die gifjes (menu_news.gif etc.) ging invoeren.
als ik al deze plaatjes weghaal (inclusief de textspace.gif) dan doet ie het wel goed.

nu is het vreemde dus dat de cell 15px hoog is, en de plaatjes die ik er in wil 14px.
er zit geen border om de cell, dus ik zou zeggen dat het zou moeten kunnen.
maar niets is minder waar, want dan krijg ik dus deze rare streep.

ik gebruik dezelfde plaatjes ook onderaan in een paar cellen, maar daar heb ik dit probleem niet.

nu dacht ik zelf dat de margins verkeerd stonden, maar zowel cellspacing als cellpadding staat op 0, dus dan zou hij geen spacings rond me inhoud en me cellrand zetten als het goed is.

wat doe ik nou fout?

[ Voor 19% gewijzigd door BasieP op 15-09-2004 16:21 ]

[NMe]

Ik zie eerlijk gezegd niet echt wat er fout zou moeten zijn? Ik zie geen lijnen die overbodig lijken te zijn, niet in IE en niet in FireFox. Kun je ff wijzen waar ze zitten?

[BasieP]

oke * BasieP heeft het antwoord al

ik zal even netjes posten voor ons lieve kennis db


het was dus zo dat wanneer ik dit deed:

code:

  <tr>
    <td height=15 background="menu_back.png" align="center">
      [img]"menu_textspace.gif">
[/img]
      [img]"menu_textspace.gif">
[/img]
      [img]"menu_textspace.gif">
[/img]

het niet werkte

nadat ik er dit van maakte:

code:

  <tr>
    <td height=15 background="menu_back.png" align="center">[img]"menu_textspace.gif"
[/img][img]"menu_home.gif"
[/img][img]"menu_textspace.gif"
[/img][img]"menu_news.gif"
[/img][img]"menu_textspace.gif"></td[/img]

werkte het wel

er zaten dus spaties tussen de plaatjes in.
en die spaties waren blijkbaar 16 px hoog (of in IE 17)

[ Voor 71% gewijzigd door BasieP op 15-09-2004 16:31 ]

[Roland]

Same here... Alle lijnen sluiten goed opelkaar aan...

[BasieP]

ja heb het dus net gefixt voor jullie keken waarschijnlijk

[Roland]

Goeie zaak

[crisp]

weer een topic waarin het probleem whitespace in de sourcecode is; dat mag toch wel als basic beschouwd worden inmiddels lijkt me....