Zellen verschieben sich! Alles hilft nichts!

Status
Nicht offen für weitere Antworten.
T

Toasti2000

Erfahrenes Mitglied
Sers Leute,

ich hab da ein riesiges Problem mit einer Homepage die ich gerade mache. Hoffe ihr könnt mir da helfen!

Hier erstmal der Code, danach mein Problem. Das ist der Teil des Codes, um den es letztendlich geht.

HTML: 
<table border="0" cellpadding="0" cellspacing="0">
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="15"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td width="133" bgcolor="#F6E2CC" height="50" valign="center">
  <a class="small">&nbsp;&nbsp;&nbsp;&nbsp;• </a><a href="index.php?page=start" class="navitop">Startseite</a><br>
  <a class="small">&nbsp;&nbsp;&nbsp;&nbsp;• </a><a href="index.php?page=beispiele" class="navitop">Beispiele</a><br>
  <a class="small">&nbsp;&nbsp;&nbsp;&nbsp;• </a><a href="index.php?page=planung" class="navitop">Planung</a></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td width="136" bgcolor="#F87D2D" height="50"></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td width="135" bgcolor="#F9741D" height="50"></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td width="136" bgcolor="#F96B0E" height="50"></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td bgcolor="#EF6205" width="10">&nbsp;</td>
 </tr>

 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#FFCC99" height="20">&nbsp;<a class="text">+</a> <a href="../index.php?page=home" class="navi">Startseite</a></td>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <th colspan="7" rowspan="20" valign="top" align="left" bgcolor="#F6E2CC" width="543">

<table border="0" width="500" cellpadding="15">
 <tr>
  <td align="left">

// Hier steht später der Inhalt

HTML: 
  </td>
 </tr>
</table>
  </th>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  <td bgcolor="#EF6205" width="10" rowspan="20">&nbsp;</td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="3"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#FFCC99" height="20">&nbsp;<a class="text">+</a> <a href="../index.php?page=about" class="navi">Über uns</a></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="3"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#FFCC99" height="20">&nbsp;<a class="text">+</a> <a href="../index.php?page=referenzen" class="navi">Referenzen</a></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="3"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#FFCC99" height="20">&nbsp;<a class="text">+</a> <a href="../index.php?page=kontakt" class="navi">Kontakt</a></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="3"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#FFCC99" height="20">&nbsp;<a class="text">+</a> <a href="../index.php?page=impressum" class="navi">Impressum</a></td>
 </tr>
 <tr>
  <td><img src="../images/spacer.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
 <tr>
  <td bgcolor="#F96B0E" width="99" height="250"><img src="../images/spacer_orange.gif" width="1" height="1" border="0" alt=""></td>
 </tr>
</table>

Habe da also links eine Navigation und rechts den Inhalt der Page. Dabei zieht sich der Inhalt auf der rechten Seite über mehrere Zeilen der Navigation, bzw. der linken Spalte.

In der letzten Tabellen-Zeile seht ihr ja, dass ich hier eine feste Höhe angebe (height="250"). In Zukunft soll diese aber nicht festgelegt sein, da sich die Höhe nach dem Inhalt anpassen soll.

Wenn ich jetzt aber die Höhe nicht festlege, verbreitet sich die Navigation über die gesamte linke Spalte.

Hier mal ein Screenshot, wie es dann aussieht ohne feste Höhenangabe:
1.jpg


Und so sieht es aus mit fester Höhenangabe. So soll es eigentlich aussehen!
2.jpg


Aber wie bekomme ich das hin, dass ich keine feste Höhenangabe habe, aber es sich nicht verschiebt?

Ich hoffe ihr wisst was ich meine und helft mir

DANKE!
 
Zuletzt bearbeitet:
ich hoffe, ich stege da jetzt durch...
versuche mal ein bisschen mit den Werten von cellpadding und cellspacing zu arbeiten.
 
Hmm, glaube nicht das es daran liegt, trotzdem danke für den Tipp.

Es ist auch komisch, da dieses Problem im Firefox nicht auftritt.

Aber es liegt einfach daran, dass der mir die Navigation auf die komplette Höhe des Inhalts auseinander zieht.

Ihr seht in dem Bild wo es passt doch unter der Navigation den orangenen Balken der bis ans Ende der Page geht. Diese Höhe will ich nicht fest angeben, da der Balken immer so hoch sein soll die der Inhalt rechts.

Hmmm...
 
Ich hab genau das gleiche Problem, siehe mein Thread. Bei mir zeigt der Firefox auch alles richtig an nur der IE spinnt rum. Eine Lösung wäre echt ein Segen!

edit:
woanderst sagte man mir ich solle das Menu einfach mit Listen machen, dann gäbe es das Problem nicht:
http://css.maxdesign.com.au/listamatic
 
Zuletzt bearbeitet:
Ich würde es auch über ne Liste machen, aber naja ...

Gib dochmal den kompletten Quelltext, oder die Seite zum selber anschauen ...
 
Also ich hab das jetzt mal ganz normal mit ner liste probiert, aber dann sind die zellen vornherein schon höher, daher versteh ich net wie das Problem dann nicht mehr auftauchen soll.

Klärt mich bitte auf ;)

Hier einmal die Page zum draufschauen. Ihr müsst da auf Küche klicken, dann seht ihr schon was los ist. Beim Firefox gehts, beim IE nicht.

http://www.toastdesigns.de/lotter/

Login ist "tutorials" , Passwort ist "passwort".

Wie gesagt, schaut den ersten Post von mir an, dann wisst ihr wie es aussehen soll.

Danke!

Greetz,

Basti

EDIT: Komischerweise habe ich jetzt beim Firefox das gleiche Problem!
 
Zuletzt bearbeitet:
Hm hat es bei dir nun funktioniert, weil wenn ich auf deine Seite gehe, stimmt alles, auch beim IE! Wenn ja, wie hast du es hingekriegt?
 
Dann hast du bestimmt nicht auf "Küche" geklickt.

Die Startseite geht da ich bei der, wie im Post beschrieben, eine feste Höhe angegeben habe. Nur beim Punkt Küche habe ich diese Höhe nicht angegeben und wenn du da drauf klickst siehst du was passiert.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück