Ausrichtung innerhalb einer Tabelle

Status
Nicht offen für weitere Antworten.

..ooOOipOOoo..

Mitglied
Hoi!

Ich schaffe es einfach nicht innerhalb einer Tabellenspalte (also einem <td></td> Block) verschiedene Elemente, zB 3 Bilder, verschieden auszurichten (zB eines oben, das nächste in der Mitte und das Letzte unten), dass es auch im Netscape6.x richtig dargestellt wird. Wie bekomm ich das hin?

Gruesse

..ooOOipOOoo..
 
Hoi!

Nach Stunden des Probierens und Testens habe ich ein (zwar nicht perfektes, dennoch akzeptables) Workaround hinbekommen:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <title>
            Titel
 </title>
</head>
<body style="background-image:url(Haupthintergrund.jpg)">
<center>
<table border="0" cellpadding="0" cellspacing="0" style="width:1000px;vertical-align:top;">
 <thead>
    <tr>
      <th colspan="3" style="height:100px;background-image:url(TitelBild.jpg);">
    &nbsp;
   </th>
    </tr>
   </thead>
   <tfoot>
    <tr>
      <td colspan="3" style="background-image:url(FussBild.jpg);height:49px;text-align:center;vertical-align:top;">
         &nbsp;
      </td>
    </tr>
  </tfoot>
  <tbody>
   <tr>
    <td style="background-image:url(LeistenHintergrund.jpg);vertical-align:top;">
     <div style="background-image:url(BildObenLinks.jpg);width:150px;height:150px;">&nbsp;</div>
  </td>
  <td rowspan="3" style="vertical-align:top;width:700px;overflow:hidden;">
   <!-- Der Page Main Teil kommt hier rein -->
  </td>
  <td style="background-image:url(LeistenHintergrund.jpg);vertical-align:top;">
   <div style="background-image:url(BildRechtsOben.jpg);width:150px;height:150px;">&nbsp;</div>
   </td>
 </tr>
 <tr>
  <td style="background-image:url(LeistenHintergrund.jpg);width:150px;vertical-align:top;">
   <!-- Die Linke Leiste gehört hier hin -->
  </td>
  <td style="background-image:url(LeistenHintergrund.jpg);width:150px;vertical-align:top;">
   <!-- Die Rechte Leiste gehört hier hin -->
  </td>
 </tr>
 <tr>
  <td style="background-image:url(LeistenHintergrund.jpg);vertical-align:bottom;">
   <div style="background-image:url(BildLinksUnten.jpg);width:150px;height:150px;">&nbsp;</div>
  </td>
  <td style="background-image:url(LeistenHintergrund.jpg);vertical-align:bottom;">
   <div style="background-image:url(BildRechtsUnten.jpg);width:150px;height:150px;">&nbsp;</div>
  </td>
 </tr>
 </tbody>
</table>
</center>
</body>
</html>

HTML und CSS Code ist W3 (HTML 4.1 Transitional und CSS 2) valid
Im Internet Explorer und im Opera wird die Seite perfekt dargestellt, nur im Netscape rutschen die Seitenleisten leider bei sehr großem Inhalt im Zentrum etwas runter. Warum weiß ich leider nicht.

Gruesse

..ooOOipOOoo..
 
Original geschrieben von ..ooOOipOOoo..
Ich schaffe es einfach nicht innerhalb einer Tabellenspalte (also einem <td></td> Block) verschiedene Elemente, zB 3 Bilder, verschieden auszurichten (zB eines oben, das nächste in der Mitte und das Letzte unten), dass es auch im Netscape6.x richtig dargestellt wird.

warum einfach wenns auch kompliziert geht? was für ne komplizierte lösung :)

hab deins jetzt nicht im browser ausprobiert aber der code sieht schon ziemlich wahnsinnig aus :rolleyes:

warum machst du nicht innerhalb der spalte noch einmal eine tabelle?

Code:
<table width=245 height=436 border=0 cellspacing=0 cellpadding=0>
 <tr>
  <td>
    <table width=100% height=100% border=0 cellspacing=0 cellpadding=0>
     <tr>
      <td valign=top>[bild 1]</td>
      <td valign=middle>[bild 2]</td>
      <td valign=bottom>[bild 3] </td>
     </tr>
    </table>
  </td>
 </tr>
</table>


oder hab ich jetzt etwas falsch verstanden? anhand deiner ersten beschreibung müsste das genau passen...

hope that helps

greetz
q
 
Hoi!

Im Prinzip ja, aber Netscape macht da Probleme. Meine Seite sieht so aus: http://ip-web.hn.org/gfx/layout1.gif
Das oben ist genau das was ich will und läuft im Opera und imMSIE perfekt und im Netscape akzeptabel.
Das was so "krank" an meinem Code aussieht ist, dass das Preformatiert ist (CSS Styles) und ich die Table Head/Footer/Body Tags benutzt habe.

Danke und Gruesse

..ooOOipOOoo..
 
Zuletzt bearbeitet:
Status
Nicht offen für weitere Antworten.
Zurück