Div oder Table oder gemischt - konkretes Beispiel

[chrisi2202]

Hallo zusammen,

ich brauche mal wieder euren Rat
Keine Sorge, ich will jetzt hier nicht die Gretchenfrage neu aufrollen ob table oder div, mir geht es darum, wie ich so etwas aehnliches wie in dieser website am einfachsten/besten und vor allem so hinbekomme, dass es auf jedem Bildschirm gleich aussieht:

www.designersgecko.com

Was ich meine ist der huebsche Gecko (auf logischerweise transparentem Hintergrund), der sich links oben vom Banner ueber die Navigationsleiste bis in den content schlaengelt. Ohne den Gecko haette ich das Ganze mit tables geloest, ist ja eigentlich eine einfachere Uebung. Was mache ich jetzt aber, wenn ich solche Elemente, die sich ueber mehrere Bereiche (oder eben Zeilen) ziehen einbauen moechte? Die komplette website mit divs designen? Das "normale" mit tables und divs drueber? oder ist das auch nur mit tables realisierbar (sinnvoll?)?

Danke schonmal fuer eure Hilfe!

lg
Chrisi

[max.m]

Was ich meine ist der huebsche Gecko (auf logischerweise transparentem Hintergrund), der sich links oben vom Banner ueber die Navigationsleiste bis in den content schlaengelt.

Tipp: installiere Dir für den Firefox mal das Plugin Firebug, da kannst Du dann Bereiche auf einer Seite auswählen und siehst dann das zugehörige HTML und CSS. Hilft bei solchen Dingen ungemein.

Ohne den Gecko haette ich das Ganze mit tables geloest

Wäre aber nicht der Beste Weg.

Was mache ich jetzt aber, wenn ich solche Elemente, die sich ueber mehrere Bereiche (oder eben Zeilen) ziehen einbauen moechte? Die komplette website mit divs designen?

Ja, das ist der richtige Weg!

Das "normale" mit tables und divs drueber?

Um Gottes Willen, bloss nicht!

In diesem Fall wurden einfach die Grafiken (der Gecko ist zweigeteilt) über <img> eingebunden und entsprechend mit CSS positioniert. Wenn in den entsprechenden Divs (nebeneinanderliegende Zellen) aber sonst keine Hintergrundgrafiken liegen und diese Grafik auch nicht verlinkt werden soll, kannst Du diese einfach als Hintergrundgrafik einbinden.

[chrisi2202]

Super, danke fuer die Info!
Dann wird es jetzt wohl mal Zeit, dass ich lerne wie das geht mit den DIVs und dass sie immer und ueberall da bleiben wo ich sie eigentlich haben will

lg
Chrisi

[max.m]

Bookmarke unbedingt die Seiten unter CSS und HTML / XHTML von hier:
http://www.ltfb.de/

Insbesondere selfhtml und css4you sollten Deine ständigen Begleiter sein.

[chrisi2202]

Puh, wieder zurueck aus der "ich lerne Divs"-Versenkung
Das sind tolle Seiten, erstmal danke dafuer, auch wenn ich mit Sicherheit noch nicht alles verstanden habe - gerade das Thema Positionierung ist doch ziemlich umfangreich und verwirrend fuer eienen Anfaenger - das bleibt als Nachschlage-Bibel in den Favoriten.
So, ich habe viel gelesen, tutorials angeschaut und auch schon Kleinigkeiten ausprobiert - bevor ich jetzt aber das Rad neu erfinde (und dann wahrscheinlich auch noch viereckig wie ich mich kenne ), wuerde ich mich ueber ein paar Tips gleich zu Beginn freuen - hier mal der "Plan":

Das layout wird im Prinzip gleich wie auf der Beispielseite unten, also eine Spalte bestehend aus Header, Navi-Leiste und Inhalt, logischerweise in der Reihenfolge und dann eben oben links ein Bild, das nach oben und links raussteht und den Header und die Navi-Leiste ueberlappt.
Dieses Bild mal aussen vor haette ich das so geloest:
- ein div "wrapper" oder container oder wie ihr ihn auch immer nennen wollt um alles, fixe Breite, Abstand oben 150 px, links und rechts auto - das bewirkt dann hoffentlich, dass alles immer in der Mitte und mit dem gleichen Abstand oben angezeigt wird
- darin zuerst ein Div "header", darunter ein Div "Menu" (die Navileiste), beide mit fixen Hoehen und darunter dann noch den Div "content"
-> wie ich das mit dem Bild am besten hinbekomme, weiss ich ehrlich gesagt noch nicht - geht es irgendwie mit negativer margin? muss ich dafuer den div fuers Bild im wrapper platzieren und wenn ja wie? Z-index ist mir uebrigens inzwischen ein Begriff
Ich will das Ganze gleich richtig so loesen, dass es von jedem browser und auf jeder Bildschirmgroesse richtig angezeigt wird

Was sagen die Profis? totaler Bleodsinn oder ok oder Verbesserungsvorschlaege?

Ach ja, dann noch eine weitere Verstaendnisfrage: auf manchen Seiten werde ich im content noch weiter unterteilen muessen - einfach auch mit divs im content oder?

So, das wars fuers Erste, schonmal im Voraus danke fuer eure Hilfe!

lg
Chrisi