Positionierter DIV-Bereich verrutscht, wenn mit Inhalt gefüllt

[Hooray]

Hallo liebe Leute,

ich habe ein Problem mit einem verrutschenden DIV-Container; wenn er leer ist, geht es so wie es soll, sobald ich formatierten Text (über <h1></h1> oder auch über <p></p> einfüge, verrutscht er.
Könnt Ihr bitte mal auf meiner Seite schauen, dort habe ich's genauer beschrieben.

Herzlichen Dank,
Hooray

[ChrisB]

Hi,

Könnt Ihr bitte mal auf meiner Seite schauen, dort habe ich's genauer beschrieben.

Als erstes: Fehler beseitigen

MfG ChrisB

[Gunnar Bittersmann]

@@Hooray:

nuqneH

ich habe ein Problem mit einem verrutschenden DIV-Container; wenn er leer ist, geht es so wie es soll, sobald ich formatierten Text (über <h1></h1> oder auch über <p></p> einfüge, verrutscht er.

Du möchtest die Außenabstände der betreffenden Elemente auf 0 setzen?

Übrigens ist der Container div[@id="background"] überflüssig, das geht auch ohne.

Überflüssig ist auch (für die allermeisten Browser) ein Bild für einen Farbverlauf, das geht mit Gradienten, in alten IEs mit proprietärem Filter.

Qapla'

[Hooray]

Du möchtest die Außenabstände der betreffenden Elemente auf 0 setzen?

Jau!

Überflüssig ist auch (für die allermeisten Browser) ein Bild für einen Farbverlauf, das geht mit Gradienten, in alten IEs mit proprietärem Filter.

Das hört sich interessant an - obwohl ich ja meine Lösung auch ganz pfiffig fand ;-)
Da werde ich mal nach graben.

Übrigens ist der Container div[@id="background"] überflüssig, das geht auch ohne.

Das probiere ich dann auch mal.

Qapla'

Herzlichen Dank!
Hooray

[Hooray]

Überflüssig ist auch (für die allermeisten Browser) ein Bild für einen Farbverlauf, das geht mit Gradienten, in alten IEs mit proprietärem Filter.

Das hört sich interessant an - obwohl ich ja meine Lösung auch ganz pfiffig fand ;-)
Da werde ich mal nach graben.

So, jetzt hab ich etwas gegraben:
Ist wohl leider so, dass z.B. Chrome nicht unterstützt wird, und das ist schon ein Ausschluss-Kriterium. Da müsste ich ja dann sogar 3 Versionen erstellen (IE6, Mozilla, Chrome).
Außerdem: jeder einzelne DIV-Container wird anscheinend mit einem Farbverlauf versehen, wenn ich den Gradienten in den "body" Bereich in der CSS einfüge. Zudem möchte ich einen fixierten Hintergrund, der nicht mit scrollt.
Die Version mit den doppelten transparenten Farbverläufen tut's (ausser in IE6) aber überall und lässt sich fixieren. Wäre also mein Mittel der Wahl ;-), und im IE6 mache ich einen senkrechten Farbverlauf.

Trotzdem vielen Dank für den Tip
Hooray

[Gunnar Bittersmann]

@@Hooray:

nuqneH

So, jetzt hab ich etwas gegraben:
Ist wohl leider so, dass z.B. Chrome nicht unterstützt wird

Ich weiß nicht, was du gegraben hast, aber Gold war’s wohl nicht. Eher Sch^W Sand.

Was genau soll Chrome nicht unterstützen?

Außerdem: jeder einzelne DIV-Container wird anscheinend mit einem Farbverlauf versehen, wenn ich den Gradienten in den "body" Bereich in der CSS einfüge.

Ich kann dir nicht folgen.

Qapla'

[Hooray]

Ist wohl leider so, dass z.B. Chrome nicht unterstützt wird

Ich weiß nicht, was du gegraben hast, aber Gold war’s wohl nicht. Eher Sch^W Sand.

Was genau soll Chrome nicht unterstützen?

Gradienten ;-(
ist ja auch nicht verwunderlich, denn der Bezeichner in der CSS beinhaltet ja: -moz.., wenn mich nicht alles täuscht, sagt das: nur für Mozillas... Oder gibt es eine Methode, auch Chrome zu Gradientenanzeige zu überreden?

Außerdem: jeder einzelne DIV-Container wird anscheinend mit einem Farbverlauf versehen, wenn ich den Gradienten in den "body" Bereich in der CSS einfüge.

Ich kann dir nicht folgen.

schau mal hier: Einzelne Container mit Farbverlauf da ist's hoffentlich erkennbar. Aber vielleicht müsste ich dem Gradienten noch eine Höhe verabreichen?
Und wenn Du das mit Chrome aufrufst, siehst Du auch, dass Gradienten nicht gezeigt werden.

Qapla'

Hooray

[Matthias Apsel]

Om nah hoo pez nyeetz, Hooray!

Was genau soll Chrome nicht unterstützen?

Gradienten ;-( ist ja auch nicht verwunderlich, denn der Bezeichner in der CSS beinhaltet ja: -moz.., wenn mich nicht alles täuscht, sagt das: nur für Mozillas... Oder gibt es eine Methode, auch Chrome zu Gradientenanzeige zu überreden?

-webkit-gradient?

Matthias

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

-webkit-gradient?

Ja, das auch (noch).

Wobei Chrome neben der Webkit-proprietären Syntax auch schon die CSS-3-gemäße Syntax '-webkit-linear-gradient'/'-webkit-radial-gradient' versteht. (Safari allerdings noch nicht.)

Qapla'

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

-webkit-gradient?

Ja, das auch (noch).

Wobei Chrome neben der Webkit-proprietären Syntax auch schon die CSS-3-gemäße Syntax '-webkit-linear-gradient'/'-webkit-radial-gradient' versteht. (Safari allerdings noch nicht.)

Qapla'

[Matthias Apsel]

Om nah hoo pez nyeetz, Gunnar Bittersmann!

-webkit-gradient?

Ja, das auch (noch).

so detailliert wollte ich das garnicht ausführen. Ich wollte lediglich auf das Präfix hinweisen.

Matthias

[Gunnar Bittersmann]

@@Hooray:

nuqneH

Oder gibt es eine Methode, auch Chrome zu Gradientenanzeige zu überreden?

Oder gibt es eine Methode, auch dich zur Suchmaschinenbenutzung zu überreden?

Aber vielleicht müsste ich dem Gradienten noch eine Höhe verabreichen?

Aber vielleicht auch der 'body'-Box. Dich wundert nicht etwa, dass sie nur so hoch ist, wie es ihr Inhalt verlang, und nicht die Viewporthöhe ausfüllt?

Qapla'

[Matthias Apsel]

Om nah hoo pez nyeetz, Hooray!

Da müsste ich ja dann sogar 3 Versionen erstellen (IE6, Mozilla, Chrome).

Nein. (zweites "Beachten Sie")

Außerdem: jeder einzelne DIV-Container wird anscheinend mit einem Farbverlauf versehen, wenn ich den Gradienten in den "body" Bereich in der CSS einfüge.

Hintergrundeigenschaften sollten eigentlich nicht von selbst vererbt werden.

Zudem möchte ich einen fixierten Hintergrund, der nicht mit scrollt.

SELFHTML-Wiki

Matthias