I have a child-element with position: absolute;
that should have the same width as the wrapper but has an ancestor that is positioned as well. Since the ancestors width is content dependent I can't 'back-calculate' a width that would always match the wrapper or even stay inside the viewport. Using a width in vw
and the wrappers max-width
I get the look I want but it wont work in IE8 or most Android versions.
A JS solution is easy enough but would lead to a visible jump before it's applied and a somewhat broken layout if it isn't applied at all.
So I am wondering: Is there a non-js way of enforcing a dynamic width larger than the parent-element but at most as wide as the viewport?