Für meine neue Internetseite stelle ich mir ein recht schlichtes Layout vor, bestehend aus drei Streifen, die übereinander liegen. Im oberen Streifen soll der eine Teil der Navigation liegen, im unteren der zweite Teil (Kontakt und ähnliches). Im mittleren Streifen sollen die Texte durchscrollen, die beiden Navigationsstreifen sollen also fest sein. Jetzt habe ich ja verschiedene Möglichkeiten, sowas zu realisieren. Aber mir scheint keine Möglickeit brauchbar:

Klassische Frames:
Ich lese gerade, es gibt keine Frames mehr in XHTML 1.1

Inlineframe:
Soll man laut Selfhtml auch nicht mehr benutzen, zugunsten von object.

Object:
Ok, könnte ich machen, aber ich kann das Object nicht als target für einen Link aus meiner Navigation angeben, oder doch?

Selbst wenn ich das Objecttag verwende, wie bekomme ich ohne blinde Tabelle die drei Streifen so übereinander, das die Navigationsstreifen an den beiden Kanten kleben und das Object in der Mitte immer schön den Platz einnimt, der zur Verfügung steht, am besten nur Vertikal und horizontal immer auf 640px bleibt?

Am besten mit Hilfe von divs. Dem Content-div gibst du als Eigenschaft zu allem anderen Kram noch ein overflow:scroll, und dann solltest du das haben....

---
www.kuminatano.de

Gut, soweit klar, aber welche Eigenschaft muss das Content-div bekommen, das es immer so viel Platz einnimt, das der ganze Bildschirm in der Höhe aufgefüllt wird? Die Höhe müsste ja sein: Fensterhöhe - div1 - dvi2, aber so Berechnungen sind ja bei CSS nicht drinn.

Wie groß werden denn die beiden oberen divs?

---
www.kuminatano.de

Hallo,

wie wäre es mit height:100%?

Es ist mit CSS möglich, dass ein <div> immer oben bzw. unten klebt, auch wenn man scrollt, allerdings haben die Browser damit noch Probleme...

guck doch einfach mal bei SELFHTML, was man mit position alles machen kann

Schöne Grüße,
Linda

ladylinda schrieb am 29.08.2003 12:07 wie wäre es mit height:100%?

Das hat in vielen Fällen einige Nachteile. Wenn man nämlich Pech hat, dann zieht der Browser das div wirklich auf 100% der verfügbaren Fenstergröße hoch, und man bekommt dadurch (vor allem bei wenig Inhalt) Scrollbalken, die nicht nötig sind.

FALSCH: Es sei denn, man legt die beiden oberen divs mit Hilfe von position: absolute über das content-div, und verändert dann mit Hilfe von Padding den inneren Abstand des Contents, so daß der obere Teil nicht abgeschnitten wird.

EDIT: Der obere Absatz dürfte leider ein wenig falsch sein. Statt dem inneren Abstand muss man wohl eher ein "Abstands-div" einbauen. Der innere Abstand wird ja zur Höhe addiert, so daß dann wieder diese blöden Scrollbalken auftauchen.
Das ist ein kleines Problem von CSS. Es wird immer dann wirklich haarig, wenn Pixel und Prozentangaben gemischt werden müssen. Es fehlt einfach so was wie "100% - 50px" oder "100% - Höhe eines anderen divs".

---
www.kuminatano.de

Also, das obere soll etwa 70px hoch werden, das untere etwas schmaler, vielleicht 40px. Genau weis ich das noch nicht, weil ich die Grafiken noch nicht gemacht habe. Nur diesmal möchte ich das etwas besser planen, als das letzte mal, wo mich der IE mit seinem position: fixed; so reingelegt hat. Ich könnte ja einfach eine Tabelle mit height: 99% und drei Zeilen machen, wo die obere und die untere ne feste höhe bekämen und die mittlere dann halt resizen müsste. Aber ich wollte eigentlich auf Tabellen zur Seitengestaltung verzichten.