CSS: position:fixed inside of position: fixed

Question

Okay, I\'ve noticed something, but couldn\'t find it in the CSS spec. Styling an element with position: fixed will position it absolutely, with respect to the b

Answer 1

Short Answer:

if you have a scrollable element with fixed position (a modal for example), and you want to make one of the childs fixed also(modal close button for example), here is the solution: you can make your element non-scrollable, and instead create a child inside of it and make it scrollable(modal content for example). this way , you can apply position: absolute to the child you want it to be fixed (modal close button for example), instead of position: fixed.

Long Answer:

In my case, i had a display: fixed Modal and applied the overflow: auto to it to make it scrollable. then i wanted to make the close button display: fixed.

Nesting display: fixed worked on chrome, but not in Firefox. so i changed my structure, i removed the overflow: auto from Modal to make it non-scrollable, and instead made the modal content scrollable. and also added position: absolute to close button.