✔ CSS - Hintergrundfarbe wird nicht im FF angezeigt?

[ascawath]

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:

 

[SpiceLab]

Wir so auch nicht.

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

 

[ascawath]

oh, hatte ich verpeilt

#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;
}

 

[SpiceLab]

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):

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

 

[ascawath]

hier ist nochmal der inhalt also index.php

<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

 

[SpiceLab]

hier ist nochmal der inhalt also index.php

<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.

 

[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?

 

[ascawath]

Danke, aber durch den

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

 

[SpiceLab]

Danke, aber durch den

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:

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

.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 */

 

[ascawath]

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