Hallo liebe Expertin lieber Experte,

Ich habe eine Website aufgebaut mit einer Hintergrundfarbe, darüber ist einer anderer Bereich mit einer Umrandung und einer anderen Hintergrundfarbe.
Aber die Zweite Farbe wird im FF nicht angezeigt, und ich weiß nicht warum:

Wir so auch nicht.

Will sagen, dazu muß der HTML- und CSS-Code vorliegen.

oh, hatte ich verpeilt :P

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14

#umrandung { border:solid 2px; border-color:black; min-height:200%; width:71.69%; background-color: #808080; left:50%; margin-left:-36.04%; text-align:center; float:center; position:relative; -webkit-border-radius:10px; -moz-border-radius:10px; }

Die Hintergrundfarbe wird sehr wohl (in allen Browsern!) dargestellt, wenn das Element einen Inhalt besitzt.

Ohne diesen führt deine Mindesthöhenregelung mit relativem / prozentualen Wert (in allen Browsern!) ins Leere. 200% von was?

Dazu wäre dann z.B. dieser Zusatz erforderlich, womit die Box doppelt so hoch angezeigt wird, wie der vertikale Viewport (Anzeigebereich des Browsers):

Code css:

1 2 3 4 5

html,body {     height:100%;     margin:0; }

hier ist nochmal der inhalt also index.php

Code :

1	<div class="mitte" id="umrandung">

und da drin ist das menü un das ganze andere mit drin und schließt dann auch erst wieder als letztes
hat aber geholfen, danke dafür

Zitat von ascawath

hier ist nochmal der inhalt also index.php

Code :

1	<div class="mitte" id="umrandung">

und da drin ist das menü un das ganze andere mit drin und schließt dann auch erst wieder als letztes

Mit diesem Code-Schnippsel lässt sich rein garnix anfangen, um der (tatsächlichen) Ursache auf den Grund zu gehen.

Ich hab dein CSS zur Kontrolle eben fix nochmal in den gängigen Browsern überprüft, und zuvor alles dazu gesagt, was derzeit mit deinen mageren Angaben offensichtlich das Manko ist.

Wenn dies nicht zielführend ist/war, sei so gut, die Problemseite online zu stellen!

Übrigens, ein Wert "center" für die float-Eigenschaft existiert nicht, sondern nur "left", "right" und "none"!

Und vernachlässige in deinen Folgebeiträgen nicht die laut Netiquette gewünschte Groß-/Kleinschreibung, der du mit deiner Registrierung zugestimmt hattest.

Zitat von spicelab

Mit diesem Code-Schnippsel lässt sich rein garnix anfangen, um der (tatsächlichen) Ursache auf den Grund zu gehen.

Ich hab [...] zuvor alles dazu gesagt, was derzeit mit deinen mageren Angaben offensichtlich das Manko ist.

Reine Ursachenvermutung ob des Innenlebens von #umrandung und dessen detailierte CSS-Formatierung:

tutorials.de -> Webmaster & Internet -> Webmaster FAQ -> [CSS] Warum passt sich die Boxenhöhe nicht dem Inhalt an?

Danke, aber durch den

Code :

1 2 3 4

html, body { height: 100%; margin:0; }

hat sich das Problem schon gelöst.
Das mit dem Codeschnipsel war nur ein Versehen, ich hatte eigentlich alles kopiert.
Wie das halt immer so ist, mit viel Stress und wenig Zeit.

Aber Danke nochmal für all eure Hilfe in der letzten Zeit.

LG Ascawath

Zitat von ascawath

Danke, aber durch den

Code :

1 2 3 4

html, body { height: 100%; margin:0; }

hat sich das Problem schon gelöst.

Was meine eben geäußerte Vermutung nur bestätigt

Ohne diese "Notnagel"-CSS-Regel wird das Problem grundsätzlich so gelöst - beachte hier den hinzugefügten Klassen-Namen im class-Attribut:

Code xhtml:

1	<div class="mitte clearfix" id="umrandung">

Code css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

.clearfix:after { content:"."; display:block; height:0; font-size:0; clear:both; visibility:hidden; }   .clearfix {display:inline-block;}   /* Hides from IE-mac \*/ * html .clearfix {height:1%;} .clearfix {display:block;} /* End hide from IE-mac */

Also, wenn ich das jetzt richtig verstanden habe, führt das dazu, dass die zweite Hintergrundfarbe immer angezeigt wird?

Aber Danke für deine sehr sehr sehr schnelle Antwort.

LG Ascawath

Zitat von ascawath

Also, wenn ich das jetzt richtig verstanden habe, führt das dazu, dass die zweite Hintergrundfarbe immer angezeigt wird?

Richtig, also auch ohne min-height (oder height) für #umrandung

Ich nehme bislang an, dass in #umrandung Elemente mit float:left und/oder float:right formatiert sind, und deren Umfluß nicht mit der clear-Eigenschaft abgebrochen wurde, was diesen Fehler zur Folge hat.

Dann hätte hier aber auch der definierte Rahmen erwähnt werden müssen, der ebenfalls nicht in der vollständigen Höhe erscheint.

Wie auch immer, da der Fehler nun behoben ist, kannst du dieses, wie auch deine übrigen CSS-Themen, als erledigt markieren, damit für zukünftige Hilfesuchende ersichtlich ist, dass darin eine Lösung vorliegt.

Ahh, OK Danke.

Du/Sie haben/hast mir sehr geholfen. Ich Danke Dir/Ihnen sehr dafür.

Hoffentlich werde ich das bald auch mal alles selber lösen können.

Danke

LG Ascawath

Bleiben wir einfach beim "du"

OK; Dank dir