nicht angemeldet
Hintergrundbild rechts unter Firefox
0 0 
MudGuard
Hintergrundbild rechts unter Firefox
Hallo
Ich habe ein kleines Problem mit dem ich mich schon länger herumärgere und würde mich freuen wenn jemand von euch einen Tipp für mich hat.
Ich möchte ein Hintergrundbild am rechten Rand einer Website hinunterlaufen lassen.
Unter IE und Safari habe ich das geschafft, unter Firefox leider nicht.
Solange der Seiteninhalt sich im Browserfenster ausgeht passt alles, aber sobald das Fenster im FF so klein wird, dass man scrollen muss ist das Bild nicht mehr ganz rechts sondern nur mehr soweit rechts wie das Fenster breits is und rechts daneben is es wieder weiß, wenn ich nach rechts scrolle.
Ich habe das in einem Beispiel dargestellt:
http://anilan.otaku.at/test/test.html
Das Hintergrundbild ist genauso breit wie die rechte Spalte und sollte deshalb immer untet dem Text "Rechts" bleiben, sobald ich das Fenster im FF aber kleiner mache rutscht das Bild auch unter den Text "Mitte".
Ich habe es bereits mit background-attachment:scroll probiert, aber das hilft leider auch nichts. Ebenso hilft es nicht das Hintergrundbild auf das html statt auf den body zu setzen.
Danke für eure Tipps!
-
Hallo,
[…] sobald das Fenster im FF so klein wird, dass man scrollen muss ist das Bild nicht mehr ganz rechts sondern nur mehr soweit rechts wie das Fenster breits is und rechts daneben is es wieder weiß, wenn ich nach rechts scrolle.
Das liegt daran, dass eine Box bei overflow nicht größer wird, sondern der Text darüber hinausfließt.
Ich habe das in einem Beispiel dargestellt:
http://anilan.otaku.at/test/test.htmlDie Seite wird im Quiksmode dargestellt. Ich kann mir gut vorstellen, dass Safari im standardkonformen Modus auch richtig reagiert.
mfg. Daniel
-
Danke, ich wusste zwar nicht die Details, aber so etwas in die Richtung hab ich mir schon gedacht.
Ich verstehe auch, dass das was der Firefox macht konform ist und da IE nicht, aber es muss doch irgendeine html-konforme Möglichkeit geben ein Hintergrundbild auf einer Website rechts zu positionieren, oder?
lg, Michael
-
Hallo,
aber es muss doch irgendeine html-konforme Möglichkeit geben ein Hintergrundbild auf einer Website rechts zu positionieren, oder?
Naja, du könntest das Bild entweder am Viewport fixieren (background-attachment:fixed) oder dem <body> eine (mindest-)breite geben.
mfg. Daniel
-
Hi
Naja, du könntest das Bild entweder am Viewport fixieren (background-attachment:fixed) oder dem <body> eine (mindest-)breite geben.
Ich habe beide Varianten schon probiert, leider hilf das anscheinend bei meine Problem auch nicht.
So hab ich das probiert:
background-attachment:fixed
http://anilan.otaku.at/test/test1.htmlwidth
http://anilan.otaku.at/test/test2.htmlmin-width
http://anilan.otaku.at/test/test3.htmlHabe ich dabei was falsch gemacht?
lg, Michael
-
Hallo,
width
http://anilan.otaku.at/test/test2.htmlmin-width
http://anilan.otaku.at/test/test3.htmlHabe ich dabei was falsch gemacht?
Ja, du möchtest den <body> nicht so breit wie den Viewport machen (100%), sondern so breit, wie für das Bild benötigt.
body {min-width: 795px;}…würde helfen. Allerdings währe ein flexibles Layout natürlich besser.
mfg. Daniel
-
Hi
width
http://anilan.otaku.at/test/test2.htmlmin-width
http://anilan.otaku.at/test/test3.htmlHabe ich dabei was falsch gemacht?
Ja, du möchtest den <body> nicht so breit wie den Viewport machen (100%), sondern so breit, wie für das Bild benötigt.
Nein ich möchte den Body so breit haben wie für den Inhalt benötigt wird, und das Bild soll dann einfach ganz rechts sein und nicht irgendwo in der Mitte der Seite.
Dh. ich bräuchte irgendwie eine Möglichkeit auf die tatsächliche Breite der Seite zu setzen inklusive des Bereichs zu dem man nur mit scrollen kommt, nicht nur auf den Viewpoint.
body {min-width: 795px;}…würde helfen. Allerdings währe ein flexibles Layout natürlich besser.
Ja klar mit einem fixen Layout, wo ich eine fixe breite definiere kann ich natürlich auch das Bild an eine fixe Position von links setzen.
Aber ich will auf keinen Fall ein fixes Layout machen sondern ein flexibles, weil auch die Auflösungen der Benutzer sehr weit gefächert sind.
Und dafür bräuchte ich eben eine Möglichkeit ein Bild ganz rechts zu positionieren egal wie groß das Browserfenster und damit der Viewpoint ist.
Kann es wirklich sein, das so etwas im html nicht möglich ist?
lg, Michael
-
Hi
body {min-width: 795px;}…würde helfen. Allerdings währe ein flexibles Layout natürlich besser.
Ich hab das gerade probiert, aber nicht mal das funktioniert:
http://anilan.otaku.at/test/test3.html
lg, Michael
-
Hallo,
Ja, du möchtest den <body> nicht so breit wie den Viewport machen (100%), sondern so breit, wie für das Bild benötigt.
Nein ich möchte den Body so breit haben wie für den Inhalt benötigt wird
Und genau *diese* Breite hast du doch bereits festgelegt, indem du mehrere Elemente nebeneinander platzieren möchtest, die alle eine feste Breite haben.
und das Bild soll dann einfach ganz rechts sein und nicht irgendwo in der Mitte der Seite.
Ist es doch. Bei „background-position:scroll“ ist es immer ganz am rechten Rand der Seite. Bei „background-position:fixed“ orientiert es sich dagegen am Viewport (ist also immer rechts im Fenster, unabhängig von der Scroll-position).
Dh. ich bräuchte irgendwie eine Möglichkeit auf die tatsächliche Breite der Seite zu setzen inklusive des Bereichs zu dem man nur mit scrollen kommt, nicht nur auf den Viewpoint.
Das währe höchstens mit JavaScript möglich und auch da wäre es ziemlich umständlich.
body {min-width: 795px;}…würde helfen. Allerdings währe ein flexibles Layout natürlich besser.
Ja klar mit einem fixen Layout, wo ich eine fixe breite definiere kann ich natürlich auch das Bild an eine fixe Position von links setzen.
Aber ich will auf keinen Fall ein fixes Layout machen sondern ein flexibles, weil auch die Auflösungen der Benutzer sehr weit gefächert sind.
Jetzt bringst du mich aber durcheinander ;-)
Einerseits legst du fixe Breiten für alle Tabellenzellen fest und dann willst du ein flexibles Layout machen.
Warum lässt du nicht mal eine Breitenangabe bei deiner Tabelle weg, oder erstellst gleich ein CSS-Layout, bei der die mittlere Spalte skalierbar bleibt und zur Not unter die seitlichen Elemente rutscht?
Kann es wirklich sein, das so etwas im html nicht möglich ist?
Wenn ich wüsste, was genau du vorhast, könnte ich dir die Frage vielleicht beantworten…
mfg. Daniel
-
Und genau *diese* Breite hast du doch bereits festgelegt, indem du mehrere Elemente nebeneinander platzieren möchtest, die alle eine feste Breite haben.
Nein, ich habe 3 Elemente nebeneinander, von denen die beiden äußeren eine fixe Breite haben und das mittlere frei skalierbar ist und hängt vom jeweiligen Inhalt ab.
Ist es doch. Bei „background-position:scroll“ ist es immer ganz am rechten Rand der Seite. Bei „background-position:fixed“ orientiert es sich dagegen am Viewport (ist also immer rechts im Fenster, unabhängig von der Scroll-position).
Vielleicht haben wir unterschiedliche Firefox Versionen, aber bei mir ist das Bild bei background-position:scroll nicht am rechten Rand der Seite, sondern nur soweit rechts wie das Browserfenster breit ist.
Wenn das Browserfenster schmäler wird geht ja die Seite weiter nach rechts als das Browserfenster breit ist und das Bild ist nicht mehr ganz rechts.body {min-width: 795px;}…würde helfen. Allerdings währe ein flexibles Layout natürlich besser.
Ja klar mit einem fixen Layout, wo ich eine fixe breite definiere kann ich natürlich auch das Bild an eine fixe Position von links setzen.
Aber ich will auf keinen Fall ein fixes Layout machen sondern ein flexibles, weil auch die Auflösungen der Benutzer sehr weit gefächert sind.
Jetzt bringst du mich aber durcheinander ;-)
Einerseits legst du fixe Breiten für alle Tabellenzellen fest und dann willst du ein flexibles Layout machen.
Warum lässt du nicht mal eine Breitenangabe bei deiner Tabelle weg, oder erstellst gleich ein CSS-Layout, bei der die mittlere Spalte skalierbar bleibt und zur Not unter die seitlichen Elemente rutscht?
Also wie ich das sehe ist die mittlere Spalte frei skalierbar und hängt nur von der Breite des Browserfensters ab bzw. vom Inhalt wenn der breiter ist.
Ich möchte damit erreichen, dass bei wenig Textinhalt in der Mitte die rechte Spalten mit Hintergrund ganz rechts ist und bei viel Inhalt in der Mitte und einem kleinen Browserfenster, wenn man horizontal scrollt das Hintergundbild noch immer hinter der rechten Spalte ist.
Kann es wirklich sein, das so etwas im html nicht möglich ist?
Wenn ich wüsste, was genau du vorhast, könnte ich dir die Frage vielleicht beantworten…
Ich hab mal Screenshots gemacht um zu zeigen was ich meine:
Ich hätte es gerne so:
http://anilan.otaku.at/test/good.jpgund nicht so:
http://anilan.otaku.at/test/bad.jpg-
Hallo,
Im Prinzip möchtest du doch eigentlich, dass sich das Bild in der rechten Spalte befindet. Warum setzt du es dann nicht dort hinein?
[code lang=css]td.rechts {background:url(…)…}
mfg. Daniel
-
-
-
-
-
-
-
-
-
Hi,
Das Hintergrundbild ist genauso breit wie die rechte Spalte und sollte deshalb immer untet dem Text "Rechts" bleiben, sobald ich das Fenster im FF aber kleiner mache rutscht das Bild auch unter den Text "Mitte".
Du willst, daß das Hintergrundbild in einem Element sichtbar ist, setzt das Hintergrundbild aber in ein ganz anderes Element. Warum?
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
O o ostern ...
Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
Hi
Du willst, daß das Hintergrundbild in einem Element sichtbar ist, setzt das Hintergrundbild aber in ein ganz anderes Element. Warum?
Ok ich nehme an du meinst, dass ich es ins html Element setzen soll.
Das habe ich ebenfalls probiert, leider hilft es nicht:http://anilan.otaku.at/test/test4.html
Habe ich dabei etwas falsch gemacht oder meinst du etwas anderes?
lg, Michael
-