Set width of fixed positioned div relative to his parent having max-width

Question

Is there any solution without JS?

html

css

Answer 1

It seems there is no solution without JS. This blog post by Felipe Tadeo explains why:

https://dev.to/phillt/inherit-the-width-of-the-parent-element-when-position-fixed-is-applied

It explains the confusion around width: inherit

"Fixed positions itself relative to the viewport... whenever you inherit width (with position fixed) it will be with respect to the viewport"