Layouten mit Tabellen

[realbeginner]

Ja, ich weiß, man sollte nicht mit Tabellen layouten, aber es war eben einfach genug, es zu erlernen, also bleibe ich vorerst dabei.
Zu meinem Problem: ich habe eine Tabelle mit Zeilenhöhe 147 px. In der linken Zelle ist ein Logo mit 147 px Höhe. In der Zelle rechts daneben habe ich sieben button images mit je 21 px (147:7) Höhe eingefügt. Eigentlich müßte doch dann die Zelle mit den Buttons perfekt in die Zellenhöhe passen. Leider verreißt es aber das Layout (zumindest in FireFurz), d.h. es entstehen unschöne weiße Zwischenabstände. Woran liegt das i.d. Regel?#

Jeder Hinweis willkommen...

 

[pit-r]

Moin!

Woran liegt das i.d. Regel?

An dem, was Du uns nicht zeigst: dem Quelltext...

Ahoi - Pit

 

[realbeginner]

<div id="Layer1" style="position:absolute; left:102px; top:58px; width:831px; height:297px; z-index:1">
  <table width="892" height="297" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td><table width="892" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td width="109" rowspan="2" valign="bottom"><img src="images/spacer.gif" width="108" height="5"></td>
            <td width="196" valign="top"><img src="images/buttons/design_obenlinks_up.gif" width="196" height="18"></td>
            <td width="196" valign="top"><img src="images/buttons/design_obenlinks_up.gif" width="196" height="18"></td>
            <td width="165" valign="top"><img src="images/buttons/design_obenlinks_up.gif" width="196" height="18"></td>
            <td width="204" valign="top"><img src="images/buttons/design_obenrechts_up.gif" width="196" height="18"></td>
          </tr>
          <tr>
            <td valign="top"><img src="images/buttons/design_untenlinks_up.gif" width="196" height="18"></td>
            <td valign="top"><img src="images/buttons/design_untenlinks_up.gif" width="196" height="18"></td>
            <td valign="top"><img src="images/buttons/design_untenlinks_up.gif" width="196" height="18"></td>
            <td valign="top"><img src="images/buttons/design_untenrechts_up.gif" width="196" height="18"></td>
          </tr>
        </table>
          <table width="892" height="267" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td width="108" height="153"><img src="images/exact_logo_navi.gif" width="108" height="149"></td>
              <td width="163"><p><img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>
                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>
                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>
                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top">                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>
                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>
                <img src="images/buttons/dummy_button.gif" width="163" height="21" align="top"><br>                
              </p>
              </td>
              <td width="33"><img src="images/massband.gif" width="33" height="149" align="top"></td>
              <td width="196"><img src="images/spacer.gif" width="1" height="147"><img src="images/3d_floorstand_part2.jpg" width="195" height="146" align="top"></td>
              <td width="196"><img src="images/3d_floorstand_part3.jpg" width="196" height="146" align="top"></td>
              <td width="31"><img src="images/3d_floorstand_part4.jpg" width="31" height="146" align="top"></td>
              <td width="165" bgcolor="#4C93C1" class="textbox_right"><p class="textbox_right">fdfdfdfdf<br>
                fdfdf<br>
                dsdsdsdsgfg
              </p>
                <p class="textbox_right">hghfg<br>
                fmdkfdsfsfsehghgh<br>
                fdfd</p>                </td>
            </tr>
            <tr>
              <td height="114"><img src="images/spacer.gif" width="108" height="114"></td>
              <td colspan="2"><img src="images/3d_floorstand_part5.jpg" width="196" height="114" align="top"></td>
              <td><img src="images/3d_floorstand_part6.jpg" width="195" height="114" align="right"></td>
              <td><img src="images/3d_floorstand_part7.jpg" width="196" height="114" align="top"></td>
              <td><img src="images/3d_floorstand_part8.jpg" width="31" height="114" align="top"></td>
              <td bgcolor="#4C93C1"><table width="165" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                    <td height="80" class="textbox_right"><p class="textbox_right">gfgfgfgfdgfdg <br>
                      fdfdfdfdfdfd<br>
                      dsdsdsdsd</p>
                    </td>
                  </tr>
                  <tr>
                    <td height="34" bgcolor="#58595B"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('email','','images/buttons/email_over.gif',1)"><img src="images/buttons/email.gif" alt="Email schreiben" name="email" width="21" height="21" hspace="10" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('drucken','','images/buttons/print_over.gif',1)"><img src="images/buttons/print.gif" alt="Seite Drucken" name="drucken" width="21" height="21" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('zurueck','','images/buttons/back_over.gif',1)"><img src="images/buttons/back.gif" alt="Zurück" name="zurueck" width="21" height="21" hspace="10" border="0"></a><br>                      
                    <img src="images/spacer.gif" width="165" height="2"></td>
                  </tr>
              </table></td>
            </tr>
        </table>
      </td>
    </tr>
  </table>
</div>

 

[realbeginner]

Ist leider etwas viel Quelltext, aber besser zuviel als zuwenig.