browser not understanding css correctly

hey folks can anyone help me in debugging this weird CSS issue in the attached image as you can see I have applied.
position: fixed;
bottom: 1rem;
right: 1rem;
position: fixed;
bottom: 1rem;
right: 1rem;
but the button is not fixing on correct position I don't if this issue with CSS or my browser not parsing the CSS correctly can anyone help me in fixing this issue.
No description
22 Replies
Bardacoon
Bardacoon12mo ago
which button are you moving? The "add a new task" one? If so, the "sort by" element probably has a position of relative or something like that
Aditya Kirad
Aditya KiradOP12mo ago
here is the link to sandbox https://codesandbox.io/p/github/AdityaKirad/Instant-Tasks-Zustand/main how can position relative on another element can interfere with position fixed on other element @Bardacoon you there
Bardacoon
Bardacoon12mo ago
Yeah I managed to make it work but I don't know why it didn't work try to remove the backrop filter from the header
Bardacoon
Bardacoon12mo ago
Stack Overflow
Why does applying a CSS-Filter on the parent break the child positi...
So I have this title-screen "animation" that has the title centered on a fullscreen page and when you scroll down it becomes smaller and remains at the top of the page. Here is a working
Aditya Kirad
Aditya KiradOP12mo ago
yeah it worked for me also I wonder why backdrop-filter is breaking fixed position
Bardacoon
Bardacoon12mo ago
I read Mdn and it says position fixed is relative to the containing block, which is usually the body, but when you add the filter, you create a new containing block
Aditya Kirad
Aditya KiradOP12mo ago
I also just a medium post talking about this so is there any workaround for this
Bardacoon
Bardacoon12mo ago
Just remove the backdrop-filter It's not like it's doing something rn
Aditya Kirad
Aditya KiradOP12mo ago
@Bardacoon thank you so much
Jochem
Jochem12mo ago
you pinged me?
Aditya Kirad
Aditya KiradOP12mo ago
nope
Jochem
Jochem12mo ago
you realize I can see deleted messages, right? and that it pulls people into threads when you ping them?
Aditya Kirad
Aditya KiradOP12mo ago
maybe I don't remember if i pinged if i pinged you then it was by mistake sorry for that
Jochem
Jochem12mo ago
no worries
Aditya Kirad
Aditya KiradOP12mo ago
by the way do you know workaround for the above problem
Jochem
Jochem12mo ago
no
Aditya Kirad
Aditya KiradOP12mo ago
ok
Bardacoon
Bardacoon12mo ago
Why dont you just remove the backdrop filter? Also if you dont wanna do that you can create another button with position fixed and then you hide it on large screens
Aditya Kirad
Aditya KiradOP12mo ago
I removed that it was not very important
Bardacoon
Bardacoon12mo ago
so it should work right?
Aditya Kirad
Aditya KiradOP12mo ago
yeah it's working do you think it's a CSS bug or it was intentiona;
Bardacoon
Bardacoon12mo ago
It was intentional
Want results from more Discord servers?
Add your server