xeno: Tabelle in Div positionieren

Hallo liebe Gemeinde!

Ich habe ein Problem das mich schon seit einigen Tagen beschäftigt.
Ich sage es gleich:
Ich habe nicht sonderlich viel Ahnung von CSS/DIV etc. nichts desto trotz arbeite ich an meinen Fähigkeiten.

Es geht um eine Tabelle die ich via Photoshop erstellt habe (slicen --> Code kopiert) die nun nicht im Div Container dargestellt wird sondern rechts daneben. Das kopieren des "schlechten" Tabellen Codes von Photoshop hatte noch nie Probleme gemacht und es war auch leider meine letzte Möglichkeit, da ich vorher schon versucht hatte die Bilder in der Tabelle über Imagemaps zu verlinken, bin dort aber am mouseover kläglich gescheitert.

Fazit:

  • tabelle im Div fliegt ausm div raus und ist rechts neben den divs dargestellt.

Hier der Code:

CSS:
________________________________
#mappe {

width:402px;
    margin:0 auto;
overflow:auto;
}
________________________________

HTML:
________________________________

<div id="mappe">

<table id="Tabelle_01" width="368" height="399" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/test_01.png" width="122" height="132" alt="" /></td>
<td colspan="2">
<img src="images/test_02.png" width="125" height="132" alt="" /></td>
<td>
<img src="images/test_03.png" width="121" height="132" alt="" /></td>
</tr>
<tr>
<td>
<img src="images/test_04.png" width="122" height="135" alt="" /></td>
<td>
<img src="images/test_05.png" width="124" height="135" alt="" /></td>
<td colspan="2">
<img src="images/test_06.png" width="122" height="135" alt="" /></td>
</tr>
<tr>
<td>
<img src="images/test_07.png" width="122" height="131" alt="" /></td>
<td>
<img src="images/test_08.png" width="124" height="131" alt="" /></td>
<td colspan="2">
<img src="images/test_09.png" width="122" height="131" alt="" /></td>
</tr>
<tr>
<td>
<img src="images/Abstandhalter.gif" width="122" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="124" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="121" height="1" alt="" /></td>
</tr>
</table>
</div>
_________________________________________

Wie gesagt der Tabellen Code ist von Photoshop, dementsprechend gut. Vielleicht liegt dort das Problem ich kann es aber nicht finden da die Methode schon desöfteren funktioniert hat.

Viele Grüße aus Hessen,
xeno

  1. HAtte vergessen zu sagen das es sich um verschachtelte Div's handelt und das dort die Tabelle rausfliegt, Text etc stellt das Div normal da, nur eben die Tabelle nicht.

    Grüße,
    xeno

  2. @@xeno:

    nuqneH

    Wie gesagt der Tabellen Code ist von Photoshop, dementsprechend gut.

    Nein, er ist schlecht. Photoshop ist nicht dafür geeignet, guten HTML-Code zu erstellen. (Das ist von einem Bildverarbeitungsprogramm auch nicht zu erwarten.)

    Tabellen sind nicht dafür geeignet, eine Webseite zu layouten:

    • unflexibles Layout, kann sich nicht Gegebenheiten beim Nutzer (insb. Viewportgröße) anpassen
    • Darstellungsprobleme in verschiedenen Browsern
    • selbst bei guter Darstellung in graphischen Browsern falsche Reihenfolge der Inhalte im Quelltext, Screenreader lesen für Blinde schlecht verständlichen Kauderwelsch vor

    Und BTW: Leerzeichen in Komposita

    Vielleicht liegt dort das Problem ich kann es aber nicht finden

    Ich auch nicht. Vermeutlich liegt es nicht dort, sondern in dem Teil des Quelltextes, den du bisher verschwiegen hast. Wie wär’s mit einem Link zu deiner Seite?

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)