✔ Probleme mit Hintergrund bei Divs

[HammerHe@rt]

http://wow.nrp.de/wordpress/

Bin grade dabei nen Wordpress aufzusetzen und bischen zu modifizieren, befinde mich aber im Moment in einer Sackgasse.

Die Site bw das Template hat nen "Header" Bereich, nen "Content" Bereich sowie nen "Footer" Bereich

Header und Footer sind Divs auf 100% mit Hintergrundfarbe bzw Bild.

Nun zum eigentlichen Problem:
Wenn man das Browserfenster verkleinert und danach mit dem unteren Scrollbalken des Browsers nach rechts scrollt, sieht man plötzlich das Ende des Containers (Divs) da dieser nun nicht mehr die volle Breite hat.

Was kann man machen damit sowas nicht passiert bzw wie kann ich das umgehen?

mfG

 

[Maik]

Hi,

richte für den Header- und Footerbereich mit der min-width-Eigenschaft eine Mindestbreite ein, so lassen sie sich nur bis zu diesem festgelegten Punkt "zusammenstauchen" und behalten beim anschliessenden Rechtsscroll den "Kontakt" zum rechten Fensterrand:

#header {
        background: #000000 url(images/head-bg.gif) repeat-x;
        height: 110px;
        border-top: 5px solid #ff8601;
        position: relative;
        color: #FFFFFF;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: #666666;
        min-width:920px;
}

#footerbg {
        clear: both;
        background: #000000;
        border-top: 5px solid #ff8601;
        width: 100%;
        min-width:920px;
}

mfg Maik

 

[HammerHe@rt]

danke haut soweit erstmal hin

wie schauts bei leuten aus mit ner auflösung von 1200 * 1024 oder größer ?

 

[Maik]

Prima, ich fahre hier nämlich eine Auflösung mit 1280*1024px

Die Mindestbreite kommt doch erst und nur dann zum Tragen, wenn der Viewport des Browserfensters runterskaliert wird, ansonsten dehnen sich die Boxen auf 100% aus, unabhängig, wie groß die Monitorauflösung ist.

Oder worauf willst du hinaus?

mfg Maik

 

[HammerHe@rt]

ob man bei deiner auflösung dann eben doch das ende des containers sieht weil die mindestbreite kleiner ist als das browserfenster breit ist wenn man das fenster nnur minimal verkleinert

edit
ach vergiss das was ich geschrieben habe
war und ist zu früh ^^
habs mir eben mal einfach angeschaut und glaube ich nun verstanden wieso es auch bei größeren auflösungen geht

thx nochmal

 

[Maik]

Hi,

wie ich heute Nacht schon angedeutet hatte, nimmt man z.B. im Vollbildmodus die Mindestbreite überhaupt nicht wahr, da der Header- und Footerbereich die Fensterbreite weiterhin zu 100% ausfüllt.

Skaliert man den waagerechten Anzeigebereich des Browserfensters soweit herunter, dass die festgelegte Mindestbreite unterschritten wird, erscheint unmittelbar der horizontale Scrollbalken, da sich nun der rechte Rahmen/Rand der "Mindestbreitenbox" im nicht-sichtbaren Bereich des Fensters befindet, denn der Header und Footer lassen sich jetzt nicht mehr, wie zuvor, weiter "zusammenstauchen", wenn sie ihre Mindestbreite erreicht haben.

Netter Nebeneffekt, die von dir eingangs bemängelte Lücke zwischen dem rechten Fensterrand und den Boxen taucht nun nicht mehr auf, wenn nach rechts gescrollt wird.

Stu Nicholls' Beispiel min-width in Internet Explorer verdeutlicht das Verhalten der Box mit einer relativen Breite (= 90%) und einer Mindestbreite (= 400px) beim Verkleinern des Browserfensters ganz eindrucksvoll.

mfg Maik