WHY is display fixed position busted?

[miekwave (miek)]

Video Example:

I have a little custom chat widget located fixed position on lower right side of the page. I am puzzled as to why fixed position is not working. I’d like to know WHY its not working.

Live page example:
https://deepdiv-iteration-v3.webflow.io

Designer shared preview:
https://preview.webflow.com/preview/deepdiv-iteration-v3?utm_medium=preview_link&utm_source=designer&utm_content=deepdiv-iteration-v3&preview=6edc520bc283dc73051bcda87ae58b08&mode=preview

[EriCreator (E)]

Hello @mikeyevin! Very interesting question.
position: fixed can be broken when following properties are applied to its parent element:

• transform
• filter
• perspective

(more details here)

In your case, you are using a filter in the body which messes up the position.

Now a possible solution would be to remove the filters from your body

and a apply them to a wrapper / container.

[miekwave (miek)]

@EriCreator

Thanks for sharing that!

Wow never realized the filter breaks child fixed position. I’m gonna have to write a seperate body wrpper and reference that for global filter instead of body. Thanks!