Vertikaler Background über ganzen Bildschirm
Hi,
ich habe ein Problem mit meinem CSS Layout. Die HP soll so aussehen: -link- Ich habe eine Backgroundgrafik die horizontal sowie vertikal über dem Bildschirm verläuft. Der Content ist ein Flash Film und dieser soll genau mittig auf dem Bildschirm ausgerichtet sein. Habe jetzt mein HTML Code in drei Blöcke unterteilt: top,middle,bottom und dort die elemente Plaziert. Der middle container hat eine feste höhe und soll mittig ausgerichtet sein. Soweit geht alles aber wie schaffe ich es das der vertikale Background im top sowie bottom container sich dynamisch der Browserfenstergröße anpaßt. Ich habe mal zur Veranschaulichung feste px Werte in den height Attributen eingetragen. So siehts momentan aus: -link- Wie ihr seht paßt es sich nicht exakt an. Hier der HTML Code: PHP-Code:
PHP-Code:
Hat jemand einen Tip für mich wie ich das Problem lösen kann das sich der vertikale Bg dynamisch an die jeweiligen Bildschirmauflösung anpaßt? |
Du kannst das total vereinfachen: Du brauchst nur ein einziges div, dieses ist 100% hoch (min-height: 100%; für alle Browser und height: 100%; für IE 5 & 6), hat die Breite der Flash-Datei (dieser display: block; geben), ist horizontal zentriert (mit margin: 0 auto; ) und hat vertical.gif mit repeat-y right top. Der Body bekommt dann middlebg.gif mit repeat-x 0 100px. Absolute Positionierungen brauchst Du übrigens nicht.
|
Hi,
ich hab es jetzt so gemacht wie du es gesagt hast. Hab ein div erstellt. Diesem dann den Vertikalen Bg und dem die Attribute gegeben. Ok, der Vertikale Bg verläuft jetzt 100% über dem Bildschirm. Aber wie schaffe ich es denn jetzt das der horizontalen Bg für jede Fenstergröße im Body zentriert verläuft? Mit repeat-x 0 100px wird dieser doch fix plaziert. So siehts momentan aus: -link- HTML: PHP-Code:
PHP-Code:
|
|
1000 dank.:)
|
Zitat:
Code:
#top { Zitat:
|
WoW.
Arbeite schon lange mit XHTML + CSS. Hatte auch schon einige male mühe mit background-position. Doch das dies ist mir noch nie aufgefallen. (hatte zwar schon fehler wegen dem im Safari, doch irgendwie habe ich solchen code nie durch den Validator geschickt .... :oops: Man lernt immer dazu... Thx. |
Alle Zeitangaben in WEZ +2. Es ist jetzt 11:22 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023