✔ Abschluss des Layouts

Status
Nicht offen für weitere Antworten.
S

sente

Erfahrenes Mitglied
Hallo,

bin wiedermal auf ein Problem gestoßen. Bis jetzt habe ich bei meinen Layouts einfach unten den Abschluss weggelassen und wenn ich den Hintergrund eines Divs für Height 100% gebraucht habe, das mit einem kompletten Layout Hintergrund umgangen.

Nun geht das aber nicht (weil das Design nun mal eben so ist. :)).
Kurz zusammengefasst: Es geht um ein Menu (Links) das die gesamte Pagehöhe einnimmt.

Als Lösungsweg würde mir einfallen einen Table mit dem fortlaufenden Hintergrundbild zu erstellen und darin dann den Div für die Menupunkte (bzw. den Content).
Das wäre aber nur der letzte Ausweg und den würde ich eher ungern nehmen. :(

Habe unten mal das Ganze als Bild angehängt.

Danke,
mfG Chris
 

Anhänge

  • layout.jpg
    layout.jpg
    55,6 KB · Aufrufe: 19
Hi,

ggfs. lässt sich ja das Layout in der Vertikalen in drei Teile aufteilen: oberer Rahmen, mittlerer Teil, der wiederholt wird, und unterer Rahmen.

Kannst du den Link zur Seite nennen, damit man sich den Seitenaufbau und die grafische Umsetzung im Detail anschauen kann?
 
Hallo Maik!

Natürlich hatte ich vor das Layout vom Content und Menu in oberer Teil, mittlerer wiederholbarer Teil und unterer Teil (Abschluss) zu teilen.
Darüber ist natürlich noch ein Header, den ich jetzt mal weggelassen habe, da er nicht relevant ist.

Seite gibt es noch keine, da ich erst beim Design sitze und gerade überlegt habe, wie ich das dann am besten Slice und einbaue.

Gedacht habe ich mir es in etwa so:
Code: 
<div id="Container_Left">
   <div id="Container_Menu_Top"></div>
   <div id="Container_Menupoints">
      <ul>
         <li>Startseite...</li>
         <li>punkt2....</li>
      </ul>
   </div>
   <div id="Container_Menu_bottom"></div>
</div>
(Nur pseudo schnell runter getippt)

Container_Left: sollte das gesamte Menu beinhalten (und rechts wird dann der Content als eigener Container dazu gefloatet)
Container_Menu_Top: hätte eine fixe Größe (je nach dem geschnittenen Element)
Container_Menupoints: sollte 100% des vorhandenen Platzes im Fenster ausnützen und bekommt ein Backgroundimage das sich horizontal wiederholt.
Container_Menu_Bottom: wieder gleich wie Menu_Top (nur anderes Image)

Falls noch etwas unklar ist, sag einfach bescheid und ich zeichne das Design/Layout kurz in einen Browser rein.

Danke, mfG
Chris
 
Hab dir mal ein vereinfachtes Beispiel erstellt, das die Grundtechnik veranschaulicht.

Vielleicht kannst du ja damit was anfangen.
 

Anhänge

Hallo,

ja genau so habe ich das gemeint. (Nur halt, dass Menu und Content nicht in einer Grafik sein sollten - aber das ist ja egal, geht ums Prinzip)

Und das ist alles?
Code: 
margin:0 auto;
min-height:100%;
height:auto !important;
height:100%;
Mit height:100% hab ichs immer probiert und hat nicht geklappt, aber auf min-height habe ich nicht gedacht.

Danke vielmals,
mfG
Chris
 
sente hat gesagt.:
Und das ist alles?
Code: 
margin:0 auto;
min-height:100%;
height:auto !important;
height:100%;
Mit height:100% hab ichs immer probiert und hat nicht geklappt, aber auf min-height habe ich nicht gedacht.
Zum Vergrößern anklicken....
Möglicherweise hast du diese Regel nicht angewendet, damit die Box in der Vertikalen auf 100% gestreckt wird:

Code: 
html,body {
height:100%;
}
Der Hintergrund für das Menü und den Inhalt sollten sich aber in einer Grafik befinden, damit sich der "Rahmen" auch auf beiden Seiten unabhängig vom Elementinhalt bis zum Footer erstreckt. Ansonsten wirst du bei voneinander getrennten Hintergrundbildern wieder eine Lücke zum unteren Abschluss haben.
 
Geht es mit getrennten Grafiken nicht?
Weil wenn ich irgendetwas verändern möchte, ist das viel umständlicher als wenn die Grafiken getrennt sind?
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück