Fixierte Bereiche floaten

[lilly83]

Hallo!

Ich habe auf meiner Webpage in der rechten oberen Ecke ein Logo, das ich gerne umflossen haben möchte. Zusätzlich soll es jedoch beim Scrollen immer sichtbar - also fixiert sein. Ich habe mein Logo (aus Design-Gründen) im Hintergrundbild eingebettet - habe also ein div-Element drübergelegt, dem ich mit width und height die richtige Größe zugeordnet habe:

<div style="width:200px; height:67px; border:0px; float:right; right:0px;"></div>

soweit funktioniert das ja ganz gut, der Text umfließt somit das Logo. Nur wenn ich scrolle, habe ich natürlich den Text in meinem Logo stehen. Also habe ich mein <div>-Element fixiert:

<div style="width:200px; height:67px; border:0px; float:right; right:0px; position:fixed;"></div>

Nun ist das erzeugte Kasterl schön fixiert über der Stelle des Logos, nur funktioniert jetzt das floaten nicht mehr und ich habe wieder den Text im Logo drinnen. position:fixed und float funktionieren jeweils extra, aber nicht gemeinsam. Hat jemand eine Idee, wie ich mein Problem trotzdem lösen kann?

Liebe Grüße, Elisabeth

[ChrisB]

Hi,

position:fixed und float funktionieren jeweils extra, aber nicht gemeinsam.

Gut erkannt.

Hat jemand eine Idee, wie ich mein Problem trotzdem lösen kann?

Mit vertretbarem Aufwand? Eigentlich gar nicht.

Du könntest höchstens per JavaScript die Höhe des gefloateten Elements in Abhängigkeit vom der Scrollposition anpassen, und damit den Effekt von position:fixed simulieren.
Allerdings muss der umfliessende Inhalt dann beständig neu gerendert werden, und wird dadurch seine Höhe vermutlich auch dauernd ändern - und ich bezweifle, dass das toll aussieht.

MfG ChrisB