AndreasA: Dynamische Abstände

Hallo,

es geht um die Internetseite: Gova-Kunst.de

Auf der Startseite befindet sich oben eine Grafik mit überwiegend Text, das man als Header bezeichnen kann.
Anschließend kommt ein großes Bild, auf anderen Seiten Text+Bild, was ich als Content bezeichnen möchte.
Zum Schluss der Seite kommt noch das Menü (auf manchen Seiten auch weiter oben).

Nun zur Aufteilung: Im Grunde genommen passen alle Inhalte der meistens Seiten auf eine Bildschirmansicht. Nur kann es sein, dass jemand der im IE oder Firefox eine oder mehrere zusätzliche Leisten installiert hat und Bildschirmauflösung ...x768 hat, das Menü auf der Startseite nicht sieht.
Andererseits sieht bei großen Bildschirmauflösungen der gesamte Inhalt sehr oben hingeklatscht aus.
Etwas abgemildert habe ich dies bereits durch nicht-absolute Margins, z.b. beim header:
margin: 2.5% auto 1.5% auto;
ähnliches bei der Menüleiste.

Nur reicht das nicht ganz. Ich hätte es gern extremer. Die Menüleiste unten soll zumindest auf der Startseite IMMER noch auf dem Bildschirm sein. Bei großen Auflösungen soll noch mehr Platz zwischen den Elementen sein.

Hat jemand eine Idee dazu?

Gruß,
Andreas

  1. Nur reicht das nicht ganz. Ich hätte es gern extremer. Die Menüleiste unten soll zumindest auf der Startseite IMMER noch auf dem Bildschirm sein. Bei großen Auflösungen soll noch mehr Platz zwischen den Elementen sein.

    Da "beisst sich die Katze in den Schwanz". Für grössere Auflösungen finde ich die Idee mit den relativen margins gut. Das wird wohl auch Deine einzige Möglichkeit bleiben. Damit der Inhalt auch für kleinere Auflösungen geeignet ist, musst die Grösse Deines Layoutinhaltes anpassen. Die relativen Abstände der Element zueinander spielen da eine untergeordnetere Rolle, da sie sich der verkleinerten Fenstergrösse anpassen.

    Tipp: Für Menüs kann man prima eine ungeornete Liste verwenden, bei der man die Listenelemente (<li>) nebeneinander per display: inline; und dem gewünschte margin: ???; anzeigen lässt.

    Gruss

  2. Eine andere Möglichkeit wäre noch (zur Optimierung bei einer höhen Monitorauflösung), dass Du dem 'Header' eine prozentuale Höhe mit einem fixen top-margin zuweisst.