css Problem: #Container Höhe bis Seitenende

**nghgn** · 13.03.2011, 14:30

Hallo,

ich bin gerade dabei eine neue Seite mit Contao zu erstellen.
Body und #container sind in zwei unterschiedlichen Farben eingefärbt.
Das Css sieht momentan so aus:

Code:

html
{
	height:100%;
	min-height:100%
}
body
{
	height:100%;
	background-color:#C5D9F1;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	min-height:100%;
	padding-top:15px;
	padding-bottom:15px;
}
#header
{
	background-color:#EFEFEF;
	border:3px solid #BBBBBB;
}
#top1
{
	width:210px;
	position:absolute;
	margin-left:0;
	padding:5px;
}
#top2
{
	width:790px;
	position:absolute;
	margin-left:210px;
	padding:5px;
	text-align:center;
}
#container
{
	height:100%;
	background-color:#EFEFEF;
	border:3px solid #BBBBBB;
	min-height:100%;
}

top1 und top2 stecken im header

Ich möchte nun gerne, dass #container die Höhe vonn 100% Browserhöhe minus 15px annimmt.

Habe es schon mit height:100% und min-height:100% probiert. Nur führt das nicht zum Ergebnis.

Weiß einer Rat?

Vielen Dank für Eure Mühe

NgHgN

**delirius** · 13.03.2011, 15:33

Hast du schon versucht den #container mit margin zu ergänzen?

Code:

margin-bottom:15px

**folkfreund** · 13.03.2011, 15:35

Ich hab mal sowas hier beschrieben: http://www.contao-community.de/showt...misches-Layout
Vielleicht kannst damit ja was anfangen.

Gruß, folkfruend

**ISNC** · 24.06.2013, 13:19

Tach ich habe ein ähnliches Problem und finde auch gerade keine Lösung. Ich habe auch schon nach #left 100% gesucht und keine Lösung gefunden die funktioniert.

CONTAO 3.1
Ich verwende einen Sticky Footer der auch prima funktioniert.
Nun hätte ich gerne das der Container auch bis runter zum Sticky Footer geht.
Habe ich nicht genügend Inhalte entsteht hier eine Lücke. Hat jemand schonmal es geschafft den Container auf min-height:100%; zu setzen und es hat funktioniert?

Also ich möchte sozusagen das das gesamte Fenster nirgends eine Lücke für den body,html und wrapper lässt.
Header direkt an Container und Container direkt an Footer ohne Lücken.

**stefan-at-work** · 24.06.2013, 13:27

Code:

#wrapper {
height: auto;
min-height: 100%;

sollte eigentlich funktionieren

**ISNC** · 24.06.2013, 13:50

Leider kam es nicht zum erwünschten Ergebniss.

Hier mal der Link: http://buchenstein.x10.mx/buchenstei...chenstein.html

ist ne private Seite

Links ist ne Fahnenstange, die soll sich immer der Höhe anpassen und eben bis ganz nach unten reichen. Der Stein dort mittig ist dann sozusagen das Ende.