lousek: Fixe und variable Breiten in einer Tabelle

Hallo Forum.

Ich habe eîn kleines Problem bei einer Page. Ich möchte eine Tabelle machen, die in etwa so aussieht (Vorstellungsvermögen gebrauchen ;) ):

------------------------------------
¦    ¦           Banner       ¦    ¦
¦    ¦                        ¦    ¦
------------------------------------
¦    ¦    ¦    ¦Menu¦    ¦    ¦    ¦
¦    ¦Bild¦Bild¦Bild¦Bild¦Bild¦    ¦
------------------------------------
¦    ¦                        ¦    ¦
¦    ¦                        ¦    ¦
¦    ¦                        ¦    ¦
¦Bild¦                        ¦    ¦
¦    ¦                        ¦    ¦
¦    ¦                        ¦    ¦
------------------------------------
¦    ¦                        ¦    ¦
------------------------------------

In Deutsch:
Eine Tabelle mit 7 Spalten und 4 Zeilen.
Erste Zeile:

  • Die mittleren 5 Zellen sind verbunden
    Dritte Zeile:
  • Die mittleren 5 Zellen sind verbunden
    Vierte Zeile:
  • Die mittleren 5 Zellen sind verbunden

Was ich will ist folgendes:

  • Die Tabelle ist immer 100% von der Fensterbreite.
  • Die mittleren 5 Spalten zusammen sind immer 800px breit und nicht zusammenschiebbar (gelöst mit Bilder)/ auseinanderziehbar
  • Die Spalte links ist 195px breit und nicht zusammenschiebbar (gelöst mit transparentem Bild), auseinanderziehbar ist egal resp. sogar erwünscht
  • Die Spalte rechts ist variabel in der Breite. In den oberen beiden Zellen ist ein Hintergrundbild das sich wiederholt und so einen durchlaufenden Balken gibt wenn man das Fenster verbreitert.
  • Wenn das Fenster zusammengeschoben wird darf es die Tabelle nicht zusammenstauchen, dies wird aber mit den Bildern in den Zellen schon erreicht und ist nicht das Problem.

Mein Problem ist, dass wenn das Fenster "zu gross" ist, alle Spalten breiter werden, und nicht nur diese rechts resp. auch links.

Noch eine andere Frage:

Das Ganze könnte man ja auch mit divs machen ...
Wie ich ein div in der Mitte zentrieren kann (z.B. Bannerzelle) ist mir klar. Aber wie kann ich ein div machen, das von linken Fensterrand bis zum linken Rand der div-Bannerzelle (width: 800px) reicht, sich immer neu anpasst wenn das Fenster grösser oder kleiner wird?

Greetz, Lousek

  1. Deine Daten sind nicht wirklich tabellarisch - vermeide also die Verwendung einer Tabelle und gestalte lieber ein Semantisches Layout mit CSS.

    Der Header ist sicher kein Problem. Gebe nun der "mittleren Spalte" keine Width, sondern lasse sie den zur Verfügung stehenden Platz nutzen, setze die Seitenelemente auf position:absolute; z-index: [über der Mitte] und positioniere sie mit fester Breite dort, wo Du sie haben möchtest.

    Gruß, LX

    1. Hallo LX.

      Wie meinst du das genau (ein Semantisches Layout mit CSS)?

      Greetz, Lousek

      1. Hallo.

        Wie meinst du das genau (ein Semantisches Layout mit CSS)?

        So wie es die Fundstellen bekannter Suchmaschinen nach Angabe genau dieser Suchwörter erklären. Hast du jetzt noch Detailfragen?
        MfG, at