DIV so hoch wie Broserfenster + noch etwas

[Eistee]

Hallo,

ich habe ein kleines Problem und ich hoffe ihr könnte mir helfen
und zwar habe ich ein DIV (#DIV_Container) das immer so lang sein soll wie das Browserfenster.
ich habe auch schon dannach gegoogelt und habe das mit height 100% gefunden.

habe jetzt in meiner Datei:

body {
  height: 100%;
}
#DIV_Border { 
  height: 100%;
}
#DIV_Container {  
  height: 100%; 
}

Doch leider Funktioniert das nicht DIV_Container ist immer noch nur so groß wie der Inhalt es drückt. Habe mit dem neusten IE und FF getestet.

Das zweite Problem ist wie kann ich etwas ca. 10 Pixel nach links verschieben wenn ich das Element zuvor mit margin: 0 Auto; zentriert habe?

Gruß Eistee

 

[two-bee]

Hey,

Deine Heransgehensweise ist nicht so optimal. Denn: (vorausgesetzt es würde funktionieren) hieße dass ja im Prinzip "Alles was da ist" wobei ja verschiedene Auflösungen existieren. Was dann
aber immer zu unterschiedlichen Darstellungen führen würde.

Standart ist eigentlich dass du dir ein Container div baust

#container {
width: 800px /* Beispielwert */
margin-left: auto;
margin-right: auto;
}

und deine Seitenbereiche dann unter übergeordnete DIV schachtelst

<div id="container">
<div id="header">
</div>
<div id="content_left">
</div>
<div id="content_right">
</div>
</div>

#content_left {
width: 10%; /* von 800 Pixeln
}
/* usw... */

Mach dir keine großen Gedanken über die Höhe... Die Breite ist ausschlaggebend.
>> Sie ergibt sich aus dem Inhalt. Warum eine Höhe definieren, die nicht genutzt wird?
Zu deinem zweiten Problem:

Was meinst du?

Wie etwas nach links verschieben, wenn es per Default schon links ist?

 

[two-bee]

Das war wohl auch der Grund warum bis jetzt noch keiner geantwortet hat , oder?

 

[threadi]

Das zweite Problem ist wie kann ich etwas ca. 10 Pixel nach links verschieben wenn ich das Element zuvor mit margin: 0 Auto; zentriert habe?

Solltest Du damit meinen, dass die zentrierte Seite immer 10 Pixel weiter links stehen soll weil sie beim Durchklicken der einzelnen Seiten herumspringt, dann liegt die Lösung eher darin, den Scrollbalken des Browsers auch bei Seiten anzeigen zu lassen die keinen Scrollbalken benötigen.
Solltest Du etwas anderes meinen: versuchs mit padding.

 

[Eistee]

Danke erstmal für so viel Interesse und Hilfe!!

Das mit der ganzen höhe sollte nur dem Design dienen
Genauso das mit dem Verschieben nach Links

HIER mal meine Seite

Ich wollte den blauen kasten und den weißen Kasten dahinter (mann sieht nur einen dünnen weißen rand rechts und links bis nach unten laufen lassen. Weil ich finde das würde besser aussehen.

Und das mit dem Verschieben hat sich jetzt irgentwie von selbst gelöst
Jetzt sind alle Elemente so angeordnet wie sie sein sollten außer das unter dem Menu Bild ein kleiner Blauer Rand ist den ich mir nicht erklären kann..

Keine br's und auch kein Margin wert. Der Rand ist einfach da komisch.

 

[threadi]

Korrigier erstmal die HTML-Fehler.

[Invalid] Markup Validation of http://ffspace.de/ - W3C Markup Validator

 

[Eistee]

Danke für den Hinweis zu Validation.
Hatte ich nicht dran gedacht..

Habe jetzt alle Fehler für XHTML 1.0 behohen FFSpace

Das einzigste was ich jetzt noch hinbekommen muss ist dieses
hundertprozentig horizontale DIV (Das dunkel Blaue).

 

[threadi]

Setz noch html (ja, das Element) auf 100% und gib #DIV_border "min-height: 100%;" statt "height: 100%;".

 

[Eistee]

Ok ich habe das Element html height 100% gesetzt sowie
DIV Border min-height: 100%; und DIV Container min-height: 100%;

Es funktioniert leider nur halb der Border geht jetzt immer bis nach unten.
Nur der Comtainer noch nicht ganz.

Hoffe du kannst mir sagen warum. Danke

Gruß Eistee

 

[threadi]

Vom #DIV_Container hatte ich aber nichts gesagt. Wenn Du das auf min-height setzt, musst Du das Element davor auf height setzen. Also wieder bei #DIV_boarder min-height weg und height dazu.

Im übrigen würde ich empfehlen diesen Hintergrund als 1px hohe und entsprechend Breite Grafik zu erstellen und dem body zuzuordnen. Das spart viele div's ein in deiner div-Suppe.

 

[Eistee]

Also erstmal ein riesen Dankeschön!!
So leuft es.

Das mit dem Hintergrund kamm mir auch mal in den sinn
doch dann wäre die Arbeit umsonst gewesen.. naja mal gucken
wenn ich die übersicht verliere werde ich das wohl ändern aber Danke nochmal
habe dadruch gelernt wie es funktioniert!

Gruß Eistee