DIV - Problem mit der Höhe

Computer: Software & Programmierung HTML & CSS
#1

Hallo,

ich möchte eine Seite mit folgendem Design erstellen:

  • seite 100% höhe und breite … passt sich also dem browser an
  • 3-spaltiges design (100% breite und zwischen header und footer)
  • header und footer (je 100 pixel höhe (als bsp) und 100% breite)
  • linke und rechte spalte (je 150 pixel breite)

das problem, welches ich damit nun habe ist DIE HÖHE der 3 spalten:

  • die beiden äußeren werden ja noch im ff korrekt angezeigt
    aber: für die mittlere spalte bekomm ich einfach keine maximal mögliche höhe hin, das wird aber benötit, da es für die mittlere spalte eine eigene hintergrundfarbe gibt und ein hintergundbild das unten-rechts asugerichtet ist - ansonsten wäre das ja alles halb so wild, weil sich der bereich einfach dem inhalt angepasst hätte.

hat jemand von euch eine ahnung, wie ich solch ein design umsetzen kann?

#2

Hallo!

ich möchte eine Seite mit folgendem Design erstellen:

  • seite 100% höhe und breite … passt sich also dem browser
    an
  • 3-spaltiges design (100% breite und zwischen header und
    footer)
  • header und footer (je 100 pixel höhe (als bsp) und 100%
    breite)
  • linke und rechte spalte (je 150 pixel breite)

das problem, welches ich damit nun habe ist DIE HÖHE der 3
spalten:

  • die beiden äußeren werden ja noch im ff korrekt angezeigt
    aber: für die mittlere spalte bekomm ich einfach keine maximal
    mögliche höhe hin, das wird aber benötit, da es für die
    mittlere spalte eine eigene hintergrundfarbe gibt und ein
    hintergundbild das unten-rechts asugerichtet ist - ansonsten
    wäre das ja alles halb so wild, weil sich der bereich einfach
    dem inhalt angepasst hätte.

hat jemand von euch eine ahnung, wie ich solch ein design
umsetzen kann?

An für sich müßte für die Höhe einfach nur das Attribut height=„100%“ im table-tag gesetzt werden.

So wie ich deine Beschreibung verstehe sähe das in HTML dann so bei mir aus:

Testhoehe 100, width 150
hoehe 100, breite rest
hoehe 100, breite 100
hoehe rest, breite 150
hoehe und breite je rest, bg rot
hoehe rest, breite 150
hoehe 100, width 150
hoehe 100, breite rest
hoehe 100, breite 100

Hoffe das richtige getroffen zu haben.

Grüße

Björn

#3

An für sich müßte für die Höhe einfach nur das Attribut
height=„100%“ im table-tag gesetzt werden.

So wie ich deine Beschreibung verstehe sähe das in HTML dann
so bei mir aus:

Test

hoehe 100, width 150
hoehe 100, breite rest
hoehe 100, breite 100

hoehe rest, breite 150
hoehe und breite je rest, bg
rot
hoehe rest, breite 150

hoehe 100, width 150
hoehe 100, breite rest
hoehe 100, breite 100

Hoffe das richtige getroffen zu haben.

Grüße

Björn

Hallo Bjrön,

danke für deine Antwort - genau so mein ich das … aber kann man das auch ohne Tabellen umsetzen? Oder muss ich dieses Mal doch in den sauren Apfel beissen?

#4

Hilfreich wäre immer ein praktische Beispiel in Form eines Links zu der entsprechenden Seite.
Ich habe eine Vermutung was da los ist, aber wie gesagt nur eine Vermutung. Und die kommt jetzt:

Eine DIV-Höhe von 100% gibt es nicht. Zumindest nicht, wenn der übergeordnete DIV der body ist. Denn der Body kann unendlich hoch sein. Also stellt sich die Frage, was 100% von undendlich ist. Antwort: Unsinn.
Die vertikale Ausdehnung von Spalten reicht also nur so weit wie es nötig ist.

Deshalb kannst Du mit reinen CSS-Angaben, keine Höhe bis zum unteren Rand des Browserfensters erzeugen.
Aber es gibt einen Trick, der eigentlich keiner ist. Schließlich ist es nur eine Frage, ob man darauf kommt: http://alistapart.byteshift.de/fauxcolumns/

Gruß Marcus

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#5

Hi,

danke für deine Antwort - genau so mein ich das … aber kann
man das auch ohne Tabellen umsetzen? Oder muss ich dieses Mal
doch in den sauren Apfel beissen?

bei CSS bin ich leider nicht ganz so fitt.
Ich könnte mir aber eventuell vorstellen über eine Vorverarbeitung in PHP und/oder Javascript die Auflösung des Monitors auszulesen und darüber die Höhe anzupassen.
Nachteilig ist hier natürlich der hohe Aufwand und die fehlende Berücksichtung der Fenstergröße.

Grüße

Björn