Hintergrund "out of the blue...."
juergen
- css
hi,
ich habe alle Elemente in einem container positioniert. Für eine Seite möchte ich dessen Hintergrundfarbe blau haben. In IE6 geht das ohne Probleme mit einem zusätzlichen <div> mit hight, width:100% und Farbe blau. In Firefox wird die Farbe nicht angezeigt. Auch nicht wenn ich dem div ein min-height, min-width mitgebe. Wenn ich das div aussen um den container legen, ist die Fusszeilennavigation unterhalb des Viewports.
was tun???
juergen
Hallo,
zu aller erst: Teste deine Seite immer zuerst in Firefox und dann im IE!
Zum Problem:
Wenn der Inhalt deines Kontainers gefloated ist, kann es gut mal sein, dass der Kontainer verschwindet. Versuchs mal mit einer Höhenangabe oder Rändern. Min-height geht übrigens in IE nicht.
Ich hoffe das war dir eine kleine Hilfe. Sonst musst du die Frage irgendwie anschaulicher stellen.
mfg Bernd
Hallo,
Wenn der Inhalt deines Kontainers gefloated ist, kann es gut mal sein, dass der Kontainer verschwindet. Versuchs mal mit einer Höhenangabe oder Rändern.
Habe ich ja versucht, zum Beispiel:
#container {width: 100%; padding: 0 0 0 0; margin: 0 auto;}
html>body #container {height: auto;
/* min-height: 100%; position:relative;*/
}
#container_blu {BACKGROUND: #394bb9; height:100%; width:100%}
body> #container_blu {min-height:700px; max-width:100%; border:2px}
Es passier aber nichts!
Der Inhalt ist tatsächlich gfloated. Aber in IE geht es...
Juergen
Hi,
vielleicht kannst du alternativ background auf body anwenden oder schreibe nach den gefloateten Elementen: <div style="clear: both"> </div>
Dann erstreckt sich der Kontainer bis ans untere Ende der gefloateten Elemente.
Bernd
schreibe nach den gefloateten Elementen: <div style="clear: both"> </div>
Firefox unverändert, IE senkt den Footer ab und hat jetzt auch eine weisse Fläche davor.
»»vielleicht kannst du alternativ background auf body anwenden
zeigt keine Wirkung.
Schade,
Juergen
Dann solltest du das Dokument validieren. Das hört sich nämlich echt seltsam an.
Hi,
html>body #container {height: auto;
/* min-height: 100%; position:relative;*/
}
also, da der Inhalt gefloated ist, height:0 - das kannst Du auch weglassen.
#container_blu {BACKGROUND: #394bb9; height:100%; width:100%}
wenn dieser Container sich innerhalb von #container befindet, sind 100% von 0 immer noch 0.
body> #container_blu {min-height:700px; max-width:100%; border:2px}
Du hast schon height definiert.
Es passier aber nichts!
logisch.
freundliche Grüße
Ingo
Hallo Ingo,
ich habe jetzt den ganzen Spagetticode gelöscht:
"» html>body #container {height: auto;
body> #container_blu {min-height:700px; max-width:100%;}"
und "dirty way" dem Container im Dokument einen blauen Hintergrund verpasst. IE frisst das, aber Firefox nicht.
Ich dachte "container" hat am Ende die Fläche aller der sich darin befindlichen Elemente (= Navi + 3 Spalten + Footer), hat er aber scheinbar für Firefox nicht...
Wie kriege ich denn nun einen blauen Hintergrund auf meine Startseite??? Oder besser hinter die 3 Spalten (Header und Footer möglichst nicht)
Gruesse
Juergen
Hi,
Ich dachte "container" hat am Ende die Fläche aller der sich darin befindlichen Elemente (= Navi + 3 Spalten + Footer), hat er aber scheinbar für Firefox nicht...
er breitet sich - standardkonform(!= nur im Firefox) - über alle enthaltenen und im Elementenfluß befindlichen Inhalte aus. Bei gefloateten Elementen kannst Du den Fluß über ein folgendes blocklevel-Element mit der Eigenschaft clear wieder herstellen, bei absoluter Positionierung geht das nicht.
freundliche Grüße
Ingo
Hallo juergen
was tun???
Stelle die Seite online und poste uns einen Link darauf, damit wir dein
Problem im kompletten Zusammehang nachvollziehen können.
Auf Wiederlesen
Detlef