CSS:background-image Positionierung & Filter:Alpha()

CSS-Code kannst Du hier validieren lassen:

http://jigsaw.w3.org/css-validator/validator-uri.html

Ansonsten empfehle ich Dir diese Seiten:

http://www.css4you.de/

http://css.fractatulum.net/

Zitat von issie

Hintergrundbild zu positionieren mit % Angabe (wie z.B. background-position: 100% 100%) funktioniert nicht immer mit Firefox, das übrigens mit IE 6.0 funktioniert.
mir scheint, dieses Problem ist nur bei der Bestimmung innerhalb <td></td>, beim <body></body> funktioniert immer.

http://de.selfhtml.org/css/eigenschaf…ground_position
Mozilla ist bezüglich der Angabenreihenfolge der Positionen manchmal was bockig. Falls Du eine allgemeine deklaration machst (z.B. background:center bottom url() fixed;), sortier evtl. einmal die elemente um. Grundsätzlich macht Mozilla sonst keine Probleme.

Zitat von issie

Was Filter:Alpfa() funktion betrifft, funktioniert auch bei <body> Tags nicht.

http://de.selfhtml.org/css/eigenschaften/filter.htm

Mozillas kennen übrigens die CSS-Eigenschaft "opacity" mit der man auch eine Alpha-Transparenz erzeugen kann. Als Wert gibt man eine Zahl zwischen 0 und 1 an, dabei ist 1 komplett sichtbar, 0 komplett unsichtbar.

Ich würd gern nochmal darauf zurück kommen...

Auf dieser Seite von selfhtml.org steht, das Mozilla ab Version 1.0 die Positonierung "bottom" kennen sollte...

Hier allerdings funktioniert dieses Angabe nicht...

Mich würde sehr interessieren, warum es nicht funktioniert...

Der body (also das HTML-Element <body>) ist immer nur so hoch wie der Inhalt von ihm.
In deinem Fall ist also der Body ungefähr 90 Pixel hoch (eben so hoch wie die Schrift + ein bisschen Abstand oben und unten.) Füg in deine CSS-Datei doch mal ein:

body{ 
... 
border:1px solid #fff;
 ...
}

ein, dann siehst du, was ich mein.

Abhilfe: Füg noch ein min-height:100% ein:

body {
...
    background-repeat:no-repeat;
    background-position:right bottom;
    min-height:100%;
    }

Dann sollte alles wie gewollt funktionieren

Gruß HaMF

Ich muss dich enttäuschen...
das Bild hängt immernoch irgendwo oben rechts in der Ecke -.-"
Überigens funktioniert das ganze mit dem IE ganz wunderbar....

*kratz* Hab ich was verpasst? Seit wann funktioniert min-height beim Fx nicht wenn man versucht es auf den Body anzuwenden *überleg* mit height:100%; statt min-height:100% funktionierts übrigens, aber das könnte später (wenn der inhalt "höher als das Browserfenster") ist Pobleme geben.

*weiterüberleg*

edit2: ach doch ist recht logisch: so gehts (*sollte)

html{
    min-height:100%;
    }

Danke
Das funktioniert

erklärst du mir auch noch was das genau bewirkt?

genau das gleiche, was ich oben erklärt habe. Du musst dir nur statt body jedesmal ein <html> denken

Nein nochmal kurz erklärt
Dein Hintergrundbild ist ja im Grunde genommen nicht das Hintergrundbild vom gesamten Browserfenster, sondern nur von diesem <html>(bzw. Body)-Element
Und wenn dieses <html> nur ungefähr 90 Pixel hoch ist, dann passt das Hintergrundbild eben nicht ganz rein, und wird deshalb abgeschnitten.
Das min-height:100% bewirkt nun, dass dieses <html>-Element (und damit auch der body ) mindestens 100% (also so hoch wie dein Browserfenster) hoch ist. -> Das Hintergrundbild passt komplett rein und wird auch schön unten rechts ausgerichtet.

Genial...
Das ich nich selbst auf sowas komme....

Danke nochmal

...ist durchaus verständlich und keinesfalls zu kritisieren. Es gibt viele Dinge, gerade was CSS-Feinheiten angeht, die man erst mit der Zeit richtig anwenden lernt und mit den Macken der Browser umzugehen weiß.