Footer Bottom position (immer unten positionieren)

[prm]

Faux Columns

 

[ypso]

das habe ich bereits gelesen aber ich kann mit der prozentualen und der fixen varriante nicht viel anfangen bei mir verschiebt sich entwder der komplette teil komplett nach unten oder wird durch "display:inline" überhaupt nicht angzeigt =(

 

[prm]

So?

div#cont1-lineb2 {
	height:100%;
	width:100%;
	background-image:url('img/cont1-lineb1.png');
	background-repeat:repeat-y;
	background-position: 430px;
	}

 

[ypso]

so war das ja auf der seite beschrieben, das habe ich auch so übernommen nur übernimmt er die "height:100%" nicht. das div passt sich nur dem Inhalt an deshalb hab ich auch eine raute eingesetzt damit man das div überhaupt angezeigt wird. ich habe noch einen dicken roten balken eingeetzt um erkenntlich zu machen bis wohin sich das div eigentlich strecken soll.

 

[Space Vampire]

zusätzlich:

html{
height:100%;
}

body{
height:100%;
margin:0;
padding:0;
}

hast du das auch in deiner css?

 

[ypso]

japs. steht aber auch auf seite 1 das css ;)

 

[prm]

Ich verzweifle an diesem Problem.

Erkenntnis 1:
Die Hintergrundgrafik muss dem #wrapper zugewiesen werden.

Erkenntnis 2:
Die background-position benötigt einen left/top-Wert.

Erkenntnis 3:
Der IE (zumindest bis 7) unterstützt den top-Wert nicht.

Mögliche Lösung - ungetestet:
Bastle dir eine Hintergrundgrafik, die oben so weit transparent ist, bis der "Balken" dann benötigt wird. Damit könnte man den nicht unterstützten top-Wert umgehen.
Verwende für den dann folgenden Balken eine recht lange Länge, so dass damit ohne repeat auch große Viewports abgedeckt werden können.
Auf das bisherige Hintergrundbild vom #wrapper müsstest du dann verzichten oder es ggf. anderswo einbinden.

 

[ypso]

daran habe ich auch bereits gedacht das ich ein großes bild einbinde das ich oberhalb transparent lasse. allerdings geht es nicht das besagte div zu strecken =( ?

 

[prm]

Ich sehe bei dieser Gesamtkonstruktion keine Möglichkeit.
Villeicht ist aber auch nur ein generelles Umdenken erforderlich.

 

[ypso]

danke prm für deine hilfe ich habe das problem ein klein wenig anders gelöst bekommen (aber musste dem nachgehen was du sagtest). zu finden ist die fertige seite unter folgender adresse:

CRW

unter firefox, opera, safari und ie8+ wird die seite exakt so angezeigt wie es sein soll.

was ich jetzt nur nicht verstehe ist warum der IE7 den rechten teil (follow us on-box und rechter großer stripe) nicht anzeigt. ansonsten ist alles supi =)

kannst du mir vielleicht dabei noch behilflich sein wieso er die container dort ausblendet?

 

[neuroleptika]

kannst du mir vielleicht dabei noch behilflich sein wieso er die container dort ausblendet?

Es fehlt ein Wert für left in den absolute positionierten Elementen cont1-lineb, cont1-lineb2 und cont1-lineb3. Der Defaultwert für left ist auto (nicht 0). Mit diesem Wert hat der IE<8 Probleme.

 

[ypso]

hmm das heißt ich kann da nix gegen machen?

 

[neuroleptika]

Den betroffenen Elementen einen Wert für left hinzufügen:

#cont1-lineb, #cont1-lineb2 ,#cont1-lineb3 {
left: 0;
}

 

[ypso]

ehm sry ich hätte vielleicht noch hinzuschreiben sollen das ich das bereits ausprobiert hatte nach dem du deinen beitrag geschrieben hattest. das klappt leider auch nicht. der rechte teil wird immer noch nicht angezeigt auch wenn ich left werte hinzuschreibe.

außerdem gibt es kein #cont1-lineb3 oder meinst du #cont2-lineb3?

 

[neuroleptika]

Ich habe mich verguckt. Diesen Elementen habe ich left: 0 gegeben:

• #cont1-lineb
• #cont1-lineb2
• #cont2-compl

Im IE8, Browsermodus IE7 ausprobiert.

 

[ypso]

also so habe ich das auch übernommen doch bei mir zeigt er im ie7 den rechten teil immer noch nicht an. im ie8 klappt es =(

 

[neuroleptika]

also so habe ich das auch übernommen...

Wo denn?
Auf deiner verlinkten Seite jedenfalls nicht.

 

[ypso]

F.A-Crew - Family-Affairs

hab jetzt alles noch mal aktualisiert aber bei mir zeigt er im ie den rechten teil weiterhin nicht an obwohl ich die left werte genaue so wie du es mit gesagt hast in das css übernommen habe.

anbei noch ein bild um es zu beweisen ;) die rot markierten felder sind die flächen die nicht angezeigt werden im ie7:

 

[neuroleptika]

Mit den IE-Entwicklertools hat bei mir top für die Elemente gereicht. Live scheint das nicht zu klappen.
Entferne mal das float für #cont1 und gebe #cont2-lineb3 und #cont2-compl noch top:0;

Ich würde das aber mit einer Kombination aus footerStickAlt und Faux Columns umsetzen.

 

[ypso]

wunderbar =) klappt jetzt. vielen dank euch allen nochmals!