Textarea-Hintergrund fixieren unter Mozilla
Mastershrimp
- css
0 wahsaga0 Mastershrimp0 wahsaga
0 at0 Mastershrimp0 Mastershrimp0 at
Hallo!
In meinem Forum benutze ich für das Eingabe-Feld ein Hintergrundbild, das weder wiederholt wird, noch beweglich ist. Dazu benutzte ich folgende CSS-Angaben:
TEXTAREA.eintrag {
FONT-SIZE: 11px;
FONT-FAMILY: Verdana,Arial,Helvetica;
COLOR:#000000;
BACKGROUND-COLOR:#DDDDDD;
background-image:url(http://www.mastershrimp.com/inhalte/pics/forum/textarea_bg.jpg);
background-repeat:no-repeat; background-position:center; background-attachment:fixed;
border-style:solid;
border-color:(((const:tabellen_hintergrundfarbe)));
border-top-width : 1px;
border-right-width : 1px;
border-bottom-width : 1px;
border-left-width : 1px;
text-indent : 2px;
}
Im IE klappt das auch problemlos - nur unter Mozilla gehts nicht. Da wird das Bild zwar nicht wiederholt, aber es ist in der Mitte der gesamten Restseite zentriert.
Stellt euch das so vor, ihr habt eine Seite mit diesem Hintergrundbild in der Mitte und auf diese Seite schaut ihr durch die Textarea. D.h. wenn ihr die gesamte Seite scrollt, scrollt ihr auch das Hintergrundbild der Textarea hoch und runter.
Am besten schaut ihr euch das hier mal an:
http://22138.rapidforum.com/topic=100384462298&action=newposting&reverse=1
Welcher Befehl fehlt, damit Mozilla das Bild in der Textarea fixiert? Ich denke mal, dass in den Angaben oben ein Fehler ist, den der IE "korrigiert" und Mozilla nicht. Kommt ja schon mal vor.
Kann mir jemand einen Tipp geben?
Danke im Vorraus!
Gruß
Mastershrimp
hi,
Im IE klappt das auch problemlos - nur unter Mozilla gehts nicht. Da wird das Bild zwar nicht wiederholt, aber es ist in der Mitte der gesamten Restseite zentriert.
mozilla richtet bekanntlichermaßen fix positionierte hintergrundbilder nicht am element, sondern am viewport aus.
und soweit ich schon öfters gelesen habe bzw. mir erklären lassen durfte, soll er damit näher an den w3c-vorgaben liegen, als IE und opera. der sinn dieser vorgehensweise erschliesst sich mir allerdings immer noch nicht so ganz.
Welcher Befehl fehlt, damit Mozilla das Bild in der Textarea fixiert? Ich denke mal, dass in den Angaben oben ein Fehler ist, den der IE "korrigiert" und Mozilla nicht. Kommt ja schon mal vor.
nein, wie gesagt kein fehler von der syntax her, sondern eher ein konzeptioneller.
mein tipp für einen workaround:
die textarea bekommt einfach
background:transparent;
verpasst, und das hintergrundbild wird stattdessen für die umgebende tabellenzelle definiert. dann musst du nur noch sehen, dass du dieses dann exakt unter der textarea platziert kriegst - background-position wird dir da helfen, evtl. auch mit pixel- statt prozentwerten ...
gruss,
wahsaga
mein tipp für einen workaround:
die textarea bekommt einfach
background:transparent;
verpasst, und das hintergrundbild wird stattdessen für die umgebende tabellenzelle definiert. dann musst du nur noch sehen, dass du dieses dann exakt unter der textarea platziert kriegst - background-position wird dir da helfen, evtl. auch mit pixel- statt prozentwerten ...
Hmm. Und das würde auch im IE und in Opera laufen? Dass man das Bild fixieren kann, klappt auf jeden Fall, da in diesem Forum das Schnellantwortfenster auch ein Hintergrundbild hat http://18476.rapidforum.com/topic=100482616888
Die regeln das irgendwie so:
<textarea name="body" div style="background-image:url(http://avatarpage.rapidforum.com/forum/schnellantwort.jpg)" cols="95" rows="5"></textarea>
und es klappt in Mozilla.
Komisch. Kannst du mir sagen, warum das so geht? und was ist "div style"? Ich kenn nur "style"...
Gruß
Mastershrimp
hi,
Die regeln das irgendwie so:
<textarea name="body" div style="background-image:url(http://avatarpage.rapidforum.com/forum/schnellantwort.jpg)" cols="95" rows="5"></textarea>und es klappt in Mozilla.
und, hast du dies für dein problem auch ausprobiert?
(ich hoffe doch ...)
Komisch. Kannst du mir sagen, warum das so geht? und was ist "div style"? Ich kenn nur "style"...
das "div" ist dort absolut fehl am platze.
gruss,
wahsaga
und, hast du dies für dein problem auch ausprobiert?
(ich hoffe doch ...)
Ja. Wie gesagt, ich benutze folgende CSS-Anweisung für diese
Textarea:
TEXTAREA.eintrag {
FONT-SIZE: 11px;
FONT-FAMILY: Verdana,Arial,Helvetica;
COLOR:#000000;
BACKGROUND-COLOR:#DDDDDD;
background-image:url(http://www.mastershrimp.com/inhalte/pics/forum/textarea_bg.jpg);
background-repeat:no-repeat; background-position:center; background-attachment:fixed;
border-style:solid;
border-color:#000000;
border-top-width : 1px;
border-right-width : 1px;
border-bottom-width : 1px;
border-left-width : 1px;
text-indent : 2px;
}
Und die beinhaltet ja nur noch weitere Hintergrundattribute - und wenn ich die weglasse, klappts im IE ja nicht mehr. Also _müssen_ die da bleiben.
Wie würdest du denn spontan ein Hintergrundbild für eine Textarea definieren, das den W3C-Regeln entspricht? Denn das wird ja dann vorraussichtlich bei beiden (oder zumin. in Mozilla) klappen.
Es kann ja schlecht sein, dass das Ganze ohne "background-repeat:no-repeat; background-position:center; background-attachment:fixed;" in Mozilla klappt - und sonst nicht, oder?
Gruß
Mastershrimp
Hallo.
und soweit ich schon öfters gelesen habe bzw. mir erklären lassen durfte, soll er damit näher an den w3c-vorgaben liegen, als IE und opera.
Dann lies bitte hier, dass Opera so verfährt wie Mozilla.
mein tipp für einen workaround:
die textarea bekommt einfach
background:transparent;
verpasst, und das hintergrundbild wird stattdessen für die umgebende tabellenzelle definiert. dann musst du nur noch sehen, dass du dieses dann exakt unter der textarea platziert kriegst - background-position wird dir da helfen, evtl. auch mit pixel- statt prozentwerten ...
Wozu der Aufwand. "background-attachment:fixed;" tut doch nur das, was es soll. Wenn man das nicht will, kann man die Angabe doch auch einfach weglassen. Dann scrollt der Hintergrund wie gewünscht mit. Oder liegt das Problem auf einer Ebene, die ich noch nicht erklommen habe?
MfG, at
Hallo!
Oder liegt das Problem auf einer Ebene, die ich noch nicht erklommen habe?
Ich bin mir zwar nicht ganz sicher, ob du das richtige meinst, aber du kannst das Problem ganz einfach selber sehen, wenn du dir Mozilla schnappst, auf diese Seite gehst
http://22138.rapidforum.com/topic=100384462298&action=newposting&reverse=1}
und etwas rumscrollst und dabei das Textfenster beobachtest.
Danach probier das mal mit dem IE.
Es soll so werden wie im IE....geht das irgendwie? Wie ich in meinem letzten Posting geschildert habe, hat das ein anderes Forum geschafft - ich versteh aber nicht wie.
Gruß
Mastershrimp
Hallo.
Es soll so werden wie im IE....geht das irgendwie? Wie ich in meinem letzten Posting geschildert habe, hat das ein anderes Forum geschafft - ich versteh aber nicht wie.
Na gut, dann eben noch einmal deutlich das, was ich bereits gesagt hatte: Nimm "background-attachment:fixed;" heraus! Diese Zuweisung bewirkt in jeden guten grafik- und CSS2-fähigen Browser den von dir mit Mozilla beobachteten Effekt, da diese Zuweisung nichts anderes bewirkt als diesen Effekt. Der einzige aktuelle und in Bezug auf seine Verbreitung maßgebliche Browser, der diese Zuweisung nicht versteht, ist der IE in allen seinen bisherigen Versionen. Damit gilt dieser Browser in dieser Hinsicht als fehlerhaft.
MfG, at